在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)
项目地址
在VS Code中使用Snippet Craft扩展提高编码效率的更多相关文章
- 那些好用的 VS Code 插件,究竟是如何提高编码效率的?
在上一篇文章中我们已经对 vscode 插件有了一个初步的认识与了解了,接下去我们就要"揭秘"一下市面上那些好用的 vscode 插件究竟是如何帮我们提高工作效率的. 本文首发于「 ...
- 手把手教你写Sublime中的Snippet
手把手教你写Sublime中的Snippet Sublime Text号称最性感的编辑器, 并且越来越多人使用, 美观, 高效 关于如何使用Sublime text可以参考我的另一篇文章, 相信你会喜 ...
- Visual Studio Code中文文档(一)-快速入门
Visual Studio Code是一个轻量级但是十分强大的源代码编辑器,重要的是它在Windows, OS X 和Linux操作系统的桌面上均可运行.Visual Studio Code内置了对J ...
- 在 Visual Studio Code 中使用 PoweShell - CodeShell
一直希望在 Visual Studio Code 中使用 PowerShell,插件 CodeShell 提供了对于 PowerShell 的支持. 安装 首先按 F1,打开命令窗口,输入安装插件的命 ...
- Visual Studio Code中文文档
Visual Studio Code中文文档 Visual Studio Code是一个轻量级但是十分强大的源代码编辑器,重要的是它在Windows, OS X 和Linux操作系统的桌面上均可运行. ...
- 在VS Code中对Python进行单元测试
在VS Code中对Python进行单元测试 Python扩展支持使用Python的内置unittest框架以及pytest和Nose进行单元测试.要使用pytest和Nose,必须将它们安装到当前的 ...
- 如何在VS Code中进行golang编程
在VS Code中编程 使用Visual Studio Code的Go扩展,您可以获得诸如IntelliSense,代码导航,符号搜索,括号匹配,片段等语言功能,这些功能将帮助您进行Golang开发. ...
- SharePoint Framework 在Visual Studio Code中调试你的本地解决方案
博客地址:http://blog.csdn.net/FoxDave Visual Studio Code不知道大家都有没有,界面清爽,编辑快速,是一个非常好的前端开发工具.本文介绍如何使用Goog ...
- Visual Studio Code中C/C++的环境配置
Visual Studio Code 的功能十分强大,但是对我这种小白不是很友好,它和其它的集成开发工具不同,Visual Studio Code (以下简称VS)自身其实仅仅是一个编辑器, 是不具备 ...
- 微软发布 Pylance:改善 VS Code 中的 Python 体验
原标题:微软发布 Pylance:改善 VS Code 中的 Python 体验 来源:开源中国 微软宣布推出一种新的 Python 语言服务器,名为 Pylance,其可利用语言服务器协议与 VS ...
随机推荐
- [WPF]用HtmlTextBlock实现消息对话框的内容高亮和跳转
动手写一个简单的消息对话框一文介绍了如何实现满足常见应用场景的消息对话框.但是内容区域的文字仅仅起到信息展示作用,对于需要部分关键字高亮,或者部分内容有交互性的场景(例如下图提示信息中的"w ...
- k8s网络原理之flannel
首先当你创建一个k8s集群后一般会存在三种IP分别是,Pod IP,Node IP,Cluster IP 其中一个Cluster IP之下包含多个Node IP,而一个Node IP之下又包含多个Po ...
- 七牛云 + PicGo
下载PicGo https://github.com/Molunerfinn/PicGo/releases/tag/v2.3.1 七牛云配置 1.AccessKey和SecretKey:可以在七牛云控 ...
- 实测52.4MB/s!全国产ARM+FPGA的CSI通信案例分享!
CSI总线介绍与优势 CSI(CMOS sensor parallel interfaces)总线是一种用于连接图像传感器和处理器的并行通信接口,应用于工业自动化.能源电力.智慧医疗等领域,CSI总线 ...
- Canavs在文字上绘制删除线/中划线
效果图: 思路: 绘制文字 绘制高度为1px的长方形,并用黑色填充 长方形的宽度为文字的长度 具体代码: let canvas = document.getElementById('canvas'); ...
- 时间序列分析专题——利用SPSS专家建模器进行建模
SPSS的专家建模器可以自动识别数据,给出最适合的模型,本章通过三个例题介绍如何使用SPSS实现时间序列分析.由于本人对时间序列分析的理解尚浅,做出模型后在论文上的呈现形式需要取查阅资料,以便更好地在 ...
- vue2.x版本升级2.7版本
2022年7月1日,vue正式迎来2.7版本,代号:"Naruto".支持 Composition API + <script setup> .原文链接 也就是说,你可 ...
- card 卡片 html
{% extends 'base.html' %} {% block content %} <div class="container"> <h1>客户信息 ...
- 阅读翻译Mathematics for Machine Learning之2.5 Linear Independence
阅读翻译Mathematics for Machine Learning之2.5 Linear Independence 关于: 首次发表日期:2024-07-18 Mathematics for M ...
- MySQL预处理语句PREPARE、EXECUTE、DEALLOCATE使用大全
说明 MySQL官方将PREPARE.EXECUTE.DEALLOCATE统称为PREPARE STATEMENT,我习惯称其为[预处理语句]. 其语法为: PREPARE stmt_name FRO ...