eslint 和 prettier 必须同时安装并分别配置,缺一不可;关闭 javascript.validate.enable 是为避免 vscode 内置 js 校验器与 eslint 规则冲突导致重复提示或规则绕过;editor.codeactionsonsave 需显式启用 "source.fixall.eslint" 才能触发 eslint 自动修复,而非仅靠格式化;多包项目须配置 eslint.workingdirectories 确保子包规则生效;eslint-config-prettier 必须与 prettier 共用,以自动禁用 eslint 中所有格式类规则,实现职责分离。

ESLint 和 Prettier 必须同时装、分别配,缺一不可;只装一个或只开自动保存,大概率导致格式错乱、警告不显示、eslint.fixAll 失效。
为什么 javascript.validate.enable 要关掉
VSCode 内置的 JS 校验器(基于 TypeScript 语言服务)和 ESLint 功能重叠但规则不一致,开着它会导致:
- 同一行代码出现两套提示(比如分号缺失既报 ESLint 错误又报 TS 警告)
-
no-unused-vars等规则被绕过,因为内置校验不识别 ESLint 配置 - 在
.js文件里无法触发eslint.codeActionsOnSave
正确做法是在项目级 .vscode/settings.json 中显式关闭:
{
"javascript.validate.enable": false
}
editor.codeActionsOnSave 怎么设才真正生效
很多人开了 "editor.formatOnSave": true 就以为 ESLint 自动修复了,其实只是格式化,不是 lint 修复。要让 ESLint 的可修复规则(如 semi、quotes)在保存时执行,必须单独配置:
-
"source.fixAll.eslint"是开关,值设为true或"explicit"(后者要求手动触发 Ctrl+Shift+P → “Fix all auto-fixable problems”) - 不能只依赖
editor.defaultFormatter,Prettier 不处理语义规则(比如变量未使用、eval禁用) - 若项目含 React/Vue,需额外加
"source.fixAll.eslint-react"或"source.fixAll.eslint-vue"
推荐最小可行配置:
{
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
eslint.workingDirectories 在多包项目里不能省
Monorepo(如 pnpm workspace / lerna)下,VSCode 默认只在根目录找 .eslintrc.js,子包里的配置会被忽略,结果就是:
- 子包文件不报 ESLint 错误
-
eslint --fix命令能跑,但编辑器里不响应 - 修改子包
package.json后,ESLint 插件可能卡住或报Cannot find module 'eslint'
解决方法:在根目录 .vscode/settings.json 中指定工作区路径:
{
"eslint.workingDirectories": [
"./packages/*",
"./apps/*",
"./"
]
}
注意路径是相对于 VSCode 打开的根文件夹,不是相对于配置文件位置。
为什么 prettier 和 eslint-config-prettier 要一起装
Prettier 负责格式(空格、换行、引号),ESLint 负责逻辑(未使用变量、危险 API)。两者默认规则有冲突,比如:
- Prettier 强制
trailingComma: "es5",ESLint 的comma-dangle规则会报错 - Prettier 关闭分号,ESLint 的
semi规则就变成红标
不加 eslint-config-prettier,你得手动关掉几十条 ESLint 规则——容易漏、难维护。正确姿势是:
- 安装:
npm install eslint-config-prettier --save-dev - 在
.eslintrc.js的extends数组末尾加上"prettier"(顺序重要!必须在所有规则之后)
这样 ESLint 就只管语义,Prettier 只管样式,互不干扰。
最常被跳过的其实是 eslint.useFlatConfig —— 如果你用的是 ESLint v8.22+,且项目有 eslint.config.js(新 flat config),就得把它设为 true,否则插件根本读不到规则。











