设置自定义代码片段可提升VSCode编码效率,需创建JSON格式文件并定义触发词、内容和描述;通过“用户代码片段”选项选择语言或创建全局片段,编辑对应JSON文件添加名称、prefix、body和description;例如输入"log"可生成console.log语句,使用$1、$2控制光标位置,支持$TM_FILENAME等变量;保存后在对应语言中输入prefix即可触发智能提示,注意JSON语法正确。

为 VSCode 设置自定义代码片段,能大幅提升编码效率。你只需创建一个 JSON 格式的片段文件,定义触发词、内容和描述即可。
打开用户代码片段配置
在 VSCode 中,点击菜单栏的 文件 > 首选项 > 用户代码片段(Windows/Linux),或 Code > 首选项 > 用户代码片段(macOS)。接着会提示你选择语言,比如输入 “javascript” 或 “html”,VSCode 会为你生成对应语言的 snippet 文件。
编写自定义代码片段
在打开的 JSON 文件中,你可以添加自己的代码片段。每个片段包含名称、触发词、实际内容和描述。例如,设置一个快速生成 console.log 的 JavaScript 片段:
{ "Log to Console": { "prefix": "log", "body": [ "console.log('$1');", "$2" ], "description": "输出日志到控制台" } }说明:
自定义设置的程度更高可以满足大部分中小型企业的建站需求,同时修正了上一版中发现的BUG,优化了核心的代码占用的服务器资源更少,执行速度比上一版更快 主要的特色功能如下: 1)特色的菜单设置功能,菜单设置分为顶部菜单和底部菜单,每一项都可以进行更名、选择是否隐 藏,排序等。 2)增加企业基本信息设置功能,输入的企业信息可以在网页底部的醒目位置看到。 3)增加了在线编辑功能,输入产品信息,企业介绍等栏
- prefix:输入这个关键词时触发自动补全
- body:实际插入的代码,$1、$2 是光标停留位置,$1 是第一个停靠点
- description:在建议列表中显示的提示信息
使用 Tab 键跳转与变量支持
在 body 中可以使用 $1、$2 表示光标顺序跳转的位置。你也可以插入环境变量,如 $TM_FILENAME(当前文件名)、$CURRENT_YEAR 等。例如:
"Create File Header": { "prefix": "header", "body": [ "/**", " * File: $TM_FILENAME", " * Created: $CURRENT_DATE", " */" ], "description": "插入文件头注释" }全局与语言专属片段
如果你创建的是特定语言的片段(如 JavaScript),它只会在该语言文件中生效。若想创建所有语言都能用的通用片段,选择“新建全局代码片段”选项,这样定义的片段可在任意文件中触发。
基本上就这些。保存文件后,重新打开编辑器,在对应语言中输入 prefix,就能看到你的自定义片段出现在智能提示中了。不复杂但容易忽略细节,比如逗号格式或引号闭合,确保 JSON 结构正确。









