VSCode代码片段需同时匹配语言模式、JSON结构和触发前缀才能生效；最常见问题是右下角语言ID不匹配，必须手动切换为准确ID（如TypeScript React），且片段文件名、内容格式、缩进等细节必须严格规范。
VSCode 的代码片段不会自动生效，必须手动配对语言模式、JSON 结构和触发前缀，三者缺一不可。
为什么你写的 prefix 死活不弹出来？
最常被忽略的是右下角语言标识（Language Mode）不匹配。VSCode 完全不看文件后缀，只认状态栏显示的语言 ID —— 比如你打开 App.tsx，但右下角显示的是 Plain Text 或 Vue，那 typescriptreact.json 里的所有片段都不会加载。
- 点击右下角语言标签，手动切换为准确的 ID，例如
TypeScript React、JavaScript、Vue - 装了 Vetur 或 Vue Language Features 后，
.vue文件默认走vue模式，得单独配vue.code-snippets，不能复用javascript.json - 全局片段（
global.code-snippets）只在当前文件没指定语言时 fallback 使用，别指望它覆盖所有场景 - 已打开的文件可能缓存旧配置，改完 snippet 文件后关掉再重开该文件更可靠
typescriptreact.json 怎么写才不报错？
语言专属片段必须放在对应语言 ID 命名的 JSON 文件里，且外层是合法对象，不是数组。常见错误包括：逗号遗漏、引号不闭合、body 写成字符串而非字符串数组、缩进用了 Tab 而非空格（VSCode 会原样保留缩进）。
-
prefix必须是纯字符串，比如"rfc"，不能带空格或特殊符号 -
body是字符串数组，每行一个元素：["const ${1:name} = () => {", "\treturn <div>${2:content}</div>;", "}"] - 占位符用
${1:default}，不要嵌套（如${1:${2:value}}不支持） -
$0表示最终光标位置，不是编号终点；多个${1:xxx}会同步修改，适合 props 和类型定义联动
项目级片段怎么优先于全局生效？
项目级片段放在 .vscode/snippets/ 目录下，文件名必须严格匹配语言 ID（如 typescriptreact.json），不能是 tsx.json 或 react.json。它比用户级片段优先级更高，适合封装业务组件模板。
- 路径必须是项目根目录下的
.vscode/snippets/typescriptreact.json - 文件内容仍是标准 JSON 对象，每个片段键名即
prefix - 修改后需关闭并重开 VSCode 窗口（部分版本不重启不识别）
- 团队共享时可直接提交该文件到 Git，新人拉代码后开箱即用
真正卡住人的从来不是语法多难，而是语言 ID 大小写是否一致、JSON 是否多了一个逗号、右下角状态栏有没有悄悄变回 Plain Text —— 这些细节不验证，再好的模板也等于没写。
