JavaScript Booster能自动重构但不改逻辑，仅在语义等价时安全转换；ESLint与Prettier需关闭冲突开关、正确配置格式器和规则文件；Auto Import依赖TS类型定义；Live Server不可用于真实API调试。
JavaScript Booster 能自动重构但别依赖它改逻辑
它确实能一键把 var 换成 const、function 换成箭头函数、if-else 压成三元，但这些操作只在语义等价前提下安全。比如把 let a = 1; a++; 直接转成 const a = 1; 会出错——插件不会主动阻止你，它只检查语法层面是否可替换。
- 光标必须停在整行代码上（不是某个词），灯泡才稳定出现
- 对 IIFE、立即执行函数或带副作用的表达式，它可能跳过“Convert to arrow function”选项，这是保护机制，不是 bug
- “Split into declaration and initialization”适合调试，但上线前建议手动合并，避免增加不必要的变量声明层级
ESLint + Prettier 组合配置容易漏掉关键开关
很多人装完两个插件就以为万事大吉，结果保存时没格式化、也没报错——问题常出在冲突开关没关。Prettier 默认不接管 JS/TS 的格式规则，而 ESLint 的 eslint.format.enable 如果设为 true，就会和 Prettier 抢着格式化，导致部分规则失效甚至报错。
- 务必在工作区
settings.json中加这句："eslint.format.enable": false -
editor.defaultFormatter必须设为"esbenp.prettier-vscode"，否则 Alt+Shift+F 用的还是默认 formatter - 项目根目录要有
.prettierrc和.eslintrc.cjs，缺一不可；尤其.eslintrc.cjs里要显式启用plugin:prettier/recommended
Auto Import 对 TypeScript 项目有隐性依赖
它能在你输入 useState 后自动补全并插入 import { useState } from 'react'，但前提是项目里得有正确的类型定义。如果 node_modules 没装 @types/react，或者 tsconfig.json 的 compilerOptions.types 没包含 react，它就只会补空 import 或根本不出提示。
- 检查
tsconfig.json是否含"jsx": "react-jsx"和"types": ["react", "react-dom"] - 运行
npm install --save-dev @types/react @types/react-dom后重启 VSCode - 插件本身不校验路径别名（如
@/hooks），需配合Path Intellisense或Alias插件才能跳转和补全
Live Server 不该用于真实 API 调试
它开的是纯静态文件服务器，没有代理能力。当你写 fetch('/api/user')，浏览器会直接请求 http://localhost:5500/api/user，而这个地址大概率 404——后端服务根本不在同一个端口，也没 CORS 配置。
- 开发中调真实接口，优先用 VS Code 内置的
Run and Debug启动本地服务，或配proxy到后端 - Live Server 只适合纯前端 demo、文档页、组件预览这类无跨域需求的场景
- 如果非要用它测 API，得手动在浏览器控制台执行
fetch('http://localhost:3000/api/user')，绕过相对路径
真正让 JS 代码维护变专业的，不是插件数量，而是每个插件背后那几行不起眼的配置和边界认知——它们藏在文档角落，却决定着重构是否安全、格式是否生效、导入是否准确。
