在VSCode中配置自定义代码片段需创建JSON格式的.code-snippets文件，通过命令面板选择全局或语言专属方式生成，编写含prefix、body、description的规范片段，保存后即时生效，支持占位符跳转与跨平台同步。
在 VSCode 中配置自定义代码片段，核心是创建 JSON 格式的 `.code-snippets` 文件，并放在正确路径下，VSCode 会自动识别并加载。
找到或创建用户代码片段文件
打开 VSCode，按 Ctrl+Shift+P（Windows/Linux）或 Cmd+Shift+P（macOS），输入 Preferences: Configure User Snippets 并回车。然后选择 New Global Snippets file...（全局生效）或选某个语言（如 javascript.json，仅对该语言生效）。输入文件名（如 my-react.code-snippets），回车后 VSCode 会自动创建并打开该 JSON 文件。
编写符合规范的代码片段
VSCode 的代码片段是标准 JSON 格式，每个片段以唯一键名开头，包含 prefix（触发关键词）、body（插入内容）、description（提示文字）。body 支持制表符占位（$1、$2）、变量（$TM_FILENAME_BASE）和转义（用双反斜杠 \ 表示单个反斜杠）。
例如，一个 React 函数组件片段：
{
"React Functional Component": {
"prefix": "rfc",
"body": [
"const $1 = () => {",
" return (",
" <div>",
" $0",
" </div>",
" );",
"};",
"",
"export default $1;"
],
"description": "Create a React functional component"
}
}
保存后立即生效，无需重启
保存 `.code-snippets` 文件后，切换到对应语言的编辑器（如 .js 或 .tsx 文件），输入设定的 prefix（如 rfc），VSCode 会自动提示该片段。按 Tab 或回车即可插入，支持跳转占位符（$1 → $2 → … → $0 最终位置）。
- 多个片段可共存于同一文件，互不干扰
- 全局片段对所有语言有效；语言专属片段只在对应语言文件中触发
- 若片段未出现，检查文件扩展名是否为
.code-snippets，且 JSON 格式无语法错误
进阶：复用与同步片段
`.code-snippets` 文件本质是普通 JSON 文件，可直接复制到其他机器的相同路径下（如 Windows：%APPDATA%CodeUsersnippets；macOS：~/Library/Application Support/Code/User/snippets/；Linux：~/.config/Code/User/snippets/），也可纳入 Git 仓库统一管理。
想让团队共用？把片段文件放共享目录或私有 Git 仓库，成员手动复制或用脚本部署即可。
基本上就这些 —— 不复杂但容易忽略细节，关键是路径对、格式对、语言上下文对。
