在 VS Code 中通过 Ctrl+Shift+P（或 Cmd+Shift+P）运行 Preferences: Configure User Snippets 命令，选择 New Global Snippets file… 或指定语言创建 JSON 片段文件，路径依系统而异；片段需按 prefix-body-description 结构编写，body 必为字符串数组，支持 $1、${1:default}、TM_FILENAME_BASE 等变量与多光标；全局片段存于 User/snippets/，项目级可放 .vscode/snippets/ 并配置 snippetSuggestions 优先级。
如何在 VS Code 中打开用户代码片段文件
VS Code 的用户代码片段不是通过图形界面直接新建的，而是靠编辑 JSON 文件实现。按 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS），输入 Preferences: Configure User Snippets 并回车，会弹出语言选择列表；选 New Global Snippets file… 可创建跨语言通用片段，选具体语言（如 javascript）则生成对应语言专属的 javascript.code-snippets 文件。
该文件默认保存在：
- Windows：
%APPDATA%CodeUsersnippets - macOS：
$HOME/Library/Application Support/Code/User/snippets/ - Linux：
$HOME/.config/Code/User/snippets/
代码片段 JSON 结构怎么写才有效
每个片段是一个键值对，key 是触发前缀（prefix），value 是包含 body、description 等字段的对象。body 必须是字符串数组，每行一条语句，换行和缩进都靠数组元素控制。
常见错误包括：
-
body写成单个字符串（应为字符串数组） - 变量占位符写成
$1但没定义tabStop顺序，导致跳转错乱 - 未用双反斜杠转义 JSON 中的反斜杠（如正则
\d+）
示例（React 函数组件模板）：
"React Functional Component": {
"prefix": "rfc",
"body": [
"const $1 = () => {",
" return (",
" <div>$2</div>",
" );",
"};",
"",
"export default $1;"
],
"description": "Create a React functional component"
}
如何让自定义片段支持多光标与变量插入
VS Code 片段支持变量（如 TM_FILENAME_BASE）、占位符（$1、$2）和镜像（$1 在多处出现时同步更新）。关键点在于：
- 使用
$1、$2定义 tab stop 顺序，$0表示最终光标位置 - 用
${1:default}给占位符设默认值，比如${1:ComponentName} - 变量名必须全大写且带前缀（
TM_、CURRENT_YEAR等），大小写敏感 - 避免在
body中混用制表符和空格——VS Code 默认按 editor.tabSize 插入空格，不一致会导致缩进错乱
分享代码片段时要注意路径与语言作用域
直接发 .code-snippets 文件给别人，对方需手动放入对应 snippets 目录才能生效。更稳妥的方式是打包为 VS Code 扩展（用 yo code 脚手架），但多数场景下只需注意：
- 全局片段（
snippets.code-snippets）对所有语言生效，但若片段中写了"scope": "javascript,typescript"，就只在这些语言中触发 - 语言专属片段（如
python.code-snippets）不会在其他语言文件中出现，哪怕前缀相同 - 如果片段没生效，检查当前文件的语言模式是否匹配（右下角显示，可点击切换）
多人协作时，建议把常用片段放在项目根目录的 .vscode/snippets/ 下，并通过 "editor.snippetSuggestions": "top" 确保提示优先级——否则可能被内置片段盖住。
