javascript booster能安全重构代码，但仅限变量单次赋值且作用域封闭；vetur与自定义片段冲突时应禁用全局补全并明确定义vue.json；rcc等react片段需严格匹配javascriptreact语言模式。

VSCode 插件确实能帮你生成高质量代码片段，但关键不在于“装得够多”，而在于选对插件、配对场景、避开默认配置陷阱。

JavaScript Booster 重构时变量作用域容易出错

它能一键把 var 转 const、function 转箭头函数、if-else 转三元，但前提是变量没被后续重新赋值。比如这段代码：

let count = 0;<br>if (condition) {<br>  count = 1;<br>} else {<br>  count = 2;<br>}

如果直接对 if 块点灯泡选 “Replace with ?:”，插件会拒绝转换，并在状态栏提示 “Cannot convert: variable is reassigned”。这不是 bug，是保护机制。

• 它只在安全语义下工作：变量必须是单次赋值，且作用域封闭
• 遇到 let 被多次修改，先手动改成 const 或拆成独立作用域再触发
• 函数体内有 return 早出、throw、异步回调时，它不会强行转换，这点比手写更稳

Vetur 和 Vue 自定义片段冲突怎么办

两个插件都提供 <template></template>、<script setup></script> 片段，但触发前缀可能重叠（比如都响应 vue），导致补全错乱或不出现。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

解决方法不是禁用其中一个，而是明确优先级：

• 打开 settings.json，加这一行："emeraldwalk.runonsave": {"saveCommand": ""}（无关，忽略）→ 实际该加："editor.suggest.showSnippets": false 关闭全局 snippet 补全，再单独启用插件的
• 进 Preferences > Configure User Snippets，新建 vue.json，把团队约定的结构（如带 defineProps + onMounted 的 setup 模板）明确定义进去，它会压倒插件默认片段
• Vetur 的片段路径是 ~/.vscode/extensions/octref.vetur-*/snippets/，不建议直接改；自定义片段放 ~/Library/Application Support/Code/User/snippets/（macOS）或 %APPDATA%\Code\User\snippets\（Windows）更可控

ES7+ React snippets 的 rcc 不生效？检查语言模式

rcc（React Class Component）只在文件语言模式为 javascriptreact 时触发，不是 javascript，也不是 typescriptreact。

常见卡点：

• 新建 .js 文件，默认是 javascript 模式 → 必须手动点击右下角语言标识，选 “JavaScript React”
• 已开项目里某些 .jsx 文件被识别为 typescriptreact，但插件没装 TS 版本 → 装 ES7+ React/Redux/GraphQL/React-Native Snippets (TypeScript)
• jsx 语法在 javascript 模式下不报错但不补全 → 必须切到对应 React 模式，否则 rfc（Function Component）也不出来

真正难的不是找插件，而是让每个片段在正确语言、正确上下文、正确作用域里精准触发——漏掉任意一环，它就只是个安静的扩展图标。