只装 eslint、prettier、javascript booster、import cost 这 4 个核心插件，覆盖 90% js 日常痛点；需协调 eslint 与 prettier 规则、正确配置 javascript booster 触发条件、慎用 quokka.js 避免性能陷阱。
JavaScript 代码效率提升，不靠堆插件，靠选对几个关键插件并配好它们。装多了反而拖慢 VSCode、触发冲突、干扰调试——比如 ESLint 和 Prettier 规则打架，Quokka.js 在大型项目里常因内存占用高而卡顿。
只装这 4 个核心插件，覆盖 90% JS 日常痛点
别被“60个神级插件”标题带偏。真实开发中，真正高频、低干扰、能立刻见效的就这几个：
-
ESLint：查错 + 提示潜在 bug（比如未定义变量、==误用），不是只做风格检查 -
Prettier：专注格式，不碰逻辑；配合eslint-config-prettier关掉所有与格式相关的 ESLint 规则 -
JavaScript Booster：重构动作全靠灯泡图标触发，Convert to const、Replace with ?:、Split into declaration and initialization这类操作不用记快捷键 -
Import Cost：在import行末显示包体积估算（如lodash某个方法引入多少 KB），避免无意中拉进巨型依赖
ESLint 和 Prettier 别硬凑，先关掉默认冲突
很多人装完两个插件发现保存后代码越改越乱，根本原因是规则重叠。必须手动协调：
- 在
.eslintrc.js的extends数组末尾加'prettier'（即eslint-config-prettier） - VSCode 设置里关掉
editor.formatOnSave对 ESLint 的绑定，只留给 Prettier - 确保
editor.defaultFormatter设为esbenp.prettier-vscode，而不是 ESLint 扩展 - 如果用
npm run lint -- --fix，Prettier 不参与此命令，它只响应保存或手动格式化
JavaScript Booster 的灯泡不是总亮，得满足条件
它不是在任意代码行都弹灯泡，触发有明确限制：
- 光标必须落在整行语句的起始缩进位置或关键词上（比如
var、if、function），不能停在字符串中间或注释里 - 当前文件语言模式必须是
javascript或typescript（右下角看状态栏，不是plaintext） - 重构选项动态生成：比如只有存在
else块时，“Replace with ?:”才出现；箭头函数转换要求函数体是单表达式或单 return - 不支持嵌套太深的结构（如 5 层以上 if/else 嵌套），会直接隐藏选项，避免错误转换
Quokka.js 看似炫酷，但小心副作用和性能陷阱
它适合小段逻辑验证，不适合长期开着跑整个模块：
- 每次编辑都会重新执行，如果代码里有
fetch、setTimeout或全局状态修改，结果不可预测 - 大型数组遍历或递归函数容易让 Quokka 卡住，表现为编辑器无响应几秒
- 它默认启用
live comments（在代码旁显示值），但若变量名含中文或特殊符号，可能解析失败并报错ReferenceError: xxx is not defined - 建议只在新建的
.js文件里用，不要在项目源码文件里开——否则 Git 会把 Quokka 生成的临时注释当真实代码提交
最常被忽略的一点：插件本身不解决代码质量，只是放大你已有的习惯。比如 JavaScript Booster 能帮你转 var → const，但如果你从不写 var，它就永远没机会亮灯。真正的效率来自对工具边界的清醒认知，而不是插件列表越长越好。
