VSCode代码片段分用户级、语言专属和项目级三类，分别通过命令面板配置全局、语言或工作区JSON文件；支持变量占位符动态编辑，并可导入导出复用。
如果您希望在VSCode中快速插入常用代码结构，提升编码效率，则需要掌握代码片段（Snippets）的定义方式与调用机制。以下是创建与使用代码片段的具体操作步骤：
本文运行环境：MacBook Air，macOS Sequoia。
一、创建用户级代码片段
用户级代码片段适用于所有支持的语言，保存在全局配置中，便于跨项目复用。该方式无需修改工作区文件，适合通用逻辑如console.log、函数模板等。
1、打开VSCode，按下 Cmd + Shift + P（Mac）或 Ctrl + Shift + P（Windows/Linux）调出命令面板。
2、输入并选择 Preferences: Configure User Snippets。
3、在弹出菜单中选择 New Global Snippets file...，输入文件名如 common.code-snippets。
4、在生成的JSON文件中按规范添加键值对，其中key为触发前缀，body为插入内容，description为提示说明。
二、为特定语言创建语言专属片段
语言专属片段仅在对应语言模式下生效，可避免前缀冲突，适配语法特性如缩进规则、注释格式等。
1、在命令面板中执行 Preferences: Configure Language Specific Snippets。
2、从列表中选择目标语言，例如 javascript 或 python。
3、在打开的JSON文件中编写片段对象，注意 "scope": "javascript" 字段将自动注入，无需手动填写。
4、保存后，在对应语言的编辑器中输入前缀并按下 Tab 即可展开。
三、在当前工作区中定义项目级片段
项目级片段存储于工作区根目录下的 .vscode/snippets/ 文件夹内，仅对该工作区生效，适合团队统一规范或框架特有结构。
1、在工作区根目录创建 .vscode/snippets/ 文件夹（若不存在）。
ECTouch是上海商创网络科技有限公司推出的一套基于 PHP 和 MySQL 数据库构建的开源且易于使用的移动商城网店系统！应用于各种服务器平台的高效、快速和易于管理的网店解决方案，采用稳定的MVC框架开发，完美对接ecshop系统与模板堂众多模板，为中小企业提供最佳的移动电商解决方案。ECTouch程序源代码完全无加密。安装时只需将已集成的文件夹放进指定位置，通过浏览器访问一键安装，无需对已有
2、在该文件夹中新建以语言ID命名的JSON文件，例如 typescript.json。
3、按标准Snippets格式编写内容，确保每个片段包含 prefix、body 和 description 字段。
4、重启VSCode窗口或重新加载窗口（Cmd + Shift + P → Developer: Reload Window）使配置生效。
四、使用变量与占位符动态生成内容
代码片段支持内置变量（如 $TM_FILENAME_BASE）和制表位占位符（如 $1、$2），可在展开后跳转编辑，提高灵活性与上下文适配能力。
1、在 body 数组中使用 $1 表示首个光标停留位置，$2 表示第二个，依此类推。
2、插入文件名相关变量，例如 $TM_FILENAME_BASE 获取当前文件名（不含扩展名），$CURRENT_YEAR 插入当前年份。
3、使用 ${1:default} 设置默认值，光标停驻时可直接编辑或跳过。
4、多个相同编号占位符会同步更新，例如所有 $1 位置输入内容将实时一致。
五、导入与导出已有代码片段集
通过JSON文件交换可快速迁移个人常用片段或集成社区维护的高质量片段库，避免重复编写。
1、导出时，将已配置的全局或语言片段文件（位于 VSCode 配置目录中的 snippets 子目录）复制备份。
2、导入时，将JSON文件放入对应配置路径：Mac系统路径为 ~/Library/Application Support/Code/User/snippets/。
3、确认文件扩展名为 .code-snippets，且内容符合VSCode Snippets JSON Schema。
4、执行 Developer: Inspect Editor Tokens and Scopes 可验证当前语言ID，确保导入文件命名与语言ID匹配。
