在VS Code中使用Snippet Craft扩展提高编码效率的过程详解
更新时间：2024年08月23日 09:01:04 作者：林晓lx
这篇文章主要介绍了在VS Code中使用Snippet Craft扩展提高编码效率,本文通过图文并茂的形式给大家介绍的非常详细,需要的朋友可以参考下
Snippet Craft
一个VS Code代码片段管理插件
功能
创建和插入代码片段
在编辑器区域右键菜单中点击插入Snippet，或在代码片段视图中点击条目，则会将代码片段插入到当前激活文档的光标位置。
代码片段编辑
代码片段在左侧栏中，根据创建时的文件内容类型，分组显示代码片段，可编辑已有的代码片段。
代码片段预览
鼠标移动到代码片段条目上时，显示tooltip预览
默认映射
映射是插入代码片段时，自动替换的变量。
代码片段中通过设置占位符${VAR_NAME}，在插入代码片段时，将自动替换为全局变量中的值。可用的映射如下表：
| 类别 | 变量 | 描述 |
|---|---|---|
| 文件和编辑器相关 | TM_SELECTED_TEXT | 当前选定的文本或空字符串 |
| TM_CURRENT_LINE | 当前行的内容 | |
| TM_CURRENT_WORD | 光标下的单词或空字符串的内容 | |
| TM_LINE_INDEX | 基于零索引的行号 | |
| TM_LINE_NUMBER | 基于一个索引的行号 | |
| TM_FILENAME | 当前文档的文件名 | |
| TM_FILENAME_BASE | 当前文档的文件名（不含扩展名） | |
| TM_DIRECTORY | 当前文档的目录 | |
| TM_FILEPATH | 当前文档的完整文件路径 | |
| RELATIVE_FILEPATH | 当前文档的相对文件路径（相对于打开的工作区或文件夹） | |
| CLIPBOARD | 剪贴板的内容 | |
| WORKSPACE_NAME | 打开的工作区或文件夹的名称 | |
| WORKSPACE_FOLDER | 打开的工作区或文件夹的路径 | |
| CURSOR_INDEX | 基于零索引的游标编号 | |
| CURSOR_NUMBER | 基于单索引的游标编号 | |
| 时间相关 | CURRENT_YEAR | 本年度 |
| CURRENT_YEAR_SHORT | 当年的最后两位数字 | |
| CURRENT_MONTH | 两位数字的月份（例如“02”） | |
| CURRENT_MONTH_NAME | 月份的全名（例如“July”） | |
| CURRENT_MONTH_NAME_SHORT | 月份的简短名称（例如“Jul”） | |
| CURRENT_DATE | 以两位数字表示的月份中的某一天（例如“08”） | |
| CURRENT_DAY_NAME | 日期的名称（例如“星期一”） | |
| CURRENT_DAY_NAME_SHORT | 当天的简短名称（例如“Mon”） | |
| CURRENT_HOUR24 | 小时制格式的当前小时 | |
| CURRENT_MINUTE | 两位数的当前分钟数 | |
| CURRENT_SECOND | 当前秒数为两位数 | |
| CURRENT_SECONDS_UNIX | 自 Unix 纪元以来的秒数 | |
| CURRENT_TIMEZONE_OFFSET | 当前 UTC 时区偏移量为 +HH 或者 -HH (例如“-07:00”) | |
| 其他 | RANDOM6 | 6 个随机 Base-10 数字 |
| RANDOM_HEX6 | 6 个随机 Base-16 数字 | |
| UUID | 第四版UUID |
注意：当自定义映射值未设置或者不可用时，将直接显示变量占位符
自定义映射
扩展初始化时，插入了三个常用的自定义映射，你可以自由更改或添加自定义映射。
示例：
代码片段内容
value of 'AUTHOR' is: ${AUTHOR}
value of 'COMPANY' is: ${COMPANY}
value of 'MAIL' is: ${MAIL}
value of 'FOOBAR' (non-exist) is: ${FOOBAR}插入代码片段后，显示如下：
value of 'AUTHOR' is: 林晓lx
value of 'COMPANY' is: my-company
value of 'MAIL' is: jevonsflash@qq.com
value of 'FOOBAR' (non-exist) is: ${FOOBAR}与自定义映射一样，当默认映射值未设置或者不可用时，将直接显示变量占位符
自动完成
代码片段可在编辑器中显示自动提示和补全内容。
快速开始
通过点击上方横幅上的安装按钮安装 Snippet Craft，或在 VS Code 的扩展侧边栏中搜索 Snippet Craft 进行安装。
更新内容
| Date | Version | Content |
|---|---|---|
| V0.1.0 | 2024-8-22 | 初始版本 |
Todo 支持更多语言 使用monaco-editor 导入导出功能作者信息
作者：林小
邮箱：jevonsflash@qq.com
License
The MIT License (MIT)
项目地址
相关文章
这篇文章主要介绍了JavaScript 设计模式中的代理模式详解,代理模式，代理是一个对象，它可以用来控制对另一个对象的访问,更多相关内容需要的朋友可以参考一下2022-07-07
Map与WeakMap类型在JavaScript中的使用详解
这篇文章主要介绍了Map与WeakMap类型在JavaScript中的使用,本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下2020-11-11
Cannon.js可以在多种浏览器上运行,并且支持移动设备和桌面设备,这使得开发者可以轻松地在各种平台上开发和运行物理模拟应用程序,这篇文章主要介绍了Three cannon-es 基础使用,需要的朋友可以参考下2024-05-05
List Information About the Binary Files Used by an Applicati
List Information About the Binary Files Used by an Application...2007-06-06
在layui中对table中的数据进行判断(0、1)转换为提示信息的方法
今天小编就为大家分享一篇在layui中对table中的数据进行判断(0、1)转换为提示信息的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-09-09
这篇文章主要介绍了JS实现的3D拖拽翻页效果,通过鼠标事件结合时间函数动态操作页面元素实现拖拽翻页的效果,需要的朋友可以参考下2015-10-10
这篇文章主要为大家详细介绍了javascript实现文字无缝滚动效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
下面小编就为大家带来一篇解决微信二次分享不显示摘要和图片的问题。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-08-08
在javascript当中每一个function都是一个对象，所以在这个里var temp=this 指的是function当前的对象。this是Javascript语言的一个关键字。它代表函数运行时，自动生成的一个内部对象，只能在函数内部使用。2015-05-05
这篇文章主要为大家详细介绍了JS实现电商放大镜效果，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-08-08
最新评论