最常见原因是未指定语言专属默认格式器或被其他配置覆盖;VSCode不会自动选择格式器,必须显式设置如"[vue]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},否则.vue等文件跳过ESLint修复,且需配"editor.codeActionsOnSave": {"source.fixAll.eslint": "explicit"}才生效。

为什么 editor.formatOnSave 开了却没反应
最常见原因是格式化工具没指定,或者被其他配置覆盖。VSCode 不会自动猜你用哪个格式器 —— 即使装了 ESLint 插件,它默认仍可能用内置的 JS/TS 格式器,而这个格式器根本不认 ESLint 规则。
必须显式设置语言专属的默认格式器,尤其是 [vue]、[typescript] 这类场景,否则保存时压根不会触发 ESLint 修复逻辑。
-
editor.formatOnSave只是“开关”,不决定“谁来格式” - 没配
"[vue]": {"editor.defaultFormatter": "esbenp.prettier-vscode"},.vue 文件就大概率跳过 ESLint 修复 - 如果同时开了
javascript.format.enable: true,VSCode 会优先用自带格式器,直接绕过 ESLint
editor.codeActionsOnSave 怎么写才真正生效
这个字段才是 ESLint 自动修复的核心开关,不是可有可无的补充项。它的值必须精确匹配 ESLint 插件识别的动作名,写错一个字符(比如少个点、大小写不对)就静默失效。
当前稳定写法(2026 年主流插件版本)是:
"editor.codeActionsOnSave": {
"source.fixAll.eslint": "explicit"
}
注意:"explicit" 表示只在文件有 ESLint 问题时才触发修复;若设为 true,某些旧版插件可能报错或行为异常。
- 别用
"source.fixAll": true—— 这会尝试调所有代码动作,不一定走 ESLint - Vue 项目必须确保
eslint.validate包含"vue",否则source.fixAll.eslint对 .vue 文件无效 - 如果项目用的是
.eslintrc.cjs,得关掉eslint.useFlatConfig,否则验证阶段直接跳过
Prettier 和 ESLint 冲突时谁听谁的
它们不是并列关系,而是协作链:Prettier 负责“怎么排版”,ESLint 负责“哪里有问题+怎么修”。但前提是 Prettier 必须让出格式控制权,否则两个工具互相覆盖,结果不可预测。
关键配置只有两条:
- 关掉 VSCode 自带格式器:
javascript.format.enable: false和typescript.format.enable: false - 不启用已废弃的
prettier.eslintIntegration(2024 年后插件已移除该选项,设了反而报错)
真正起效的是 Prettier 的 prettier.config.js 里配 "semi": false 这类风格项,再由 ESLint 的 eslint-config-prettier 插件禁用所有与之冲突的规则 —— 这个步骤不能省,否则保存时可能删掉分号又加回来。
为什么右下角看不到 ESLint 图标
图标消失 ≠ 插件没运行,而是 VSCode 认为当前文件不受 ESLint 管理。常见于三种情况:
- 打开的文件不在工作区根目录下(比如从桌面直接拖进来的单个 .js 文件)
-
eslint.validate没包含当前语言,例如写 TypeScript 却只写了["javascript"] - 项目里没有有效的 ESLint 配置文件(
.eslintrc.cjs或eslint.config.js),插件启动后找不到规则就自动退场
临时验证方式:在 JS 文件里故意写 console.log(1);,看有没有红色波浪线。没有,基本就是配置路径或 validate 列表错了。
复杂点在于 Vue SFC 中的 <script setup> 块,它依赖 eslint-plugin-vue 和正确的 parser 解析,光靠基础配置搞不定 —— 这块最容易漏,也最难排查。


















