vscode默认不自动修复eslint错误,必须显式配置"editor.codeactionsonsave": {"source.fixall.eslint": true},并正确设置eslint.validate、eslint.options.extensions及项目配置路径,否则即使规则标✅也无法触发修复。

VSCode 默认不会在保存时自动修复 ESLint 错误,必须显式配置 editor.codeActionsOnSave 并确保 ESLint 插件能正确定位项目配置和本地依赖——否则即使规则标着 ✅ Fixable,保存也完全没反应。
editor.codeActionsOnSave 必须写成对象,不能是布尔值
很多人复制了“开启自动修复”的教程,却把配置写成 "source.fixAll.eslint": true 以外的形式,结果无效。这不是开关问题,而是 VSCode 的 code action 调用机制决定的。
- 正确写法:
"editor.codeActionsOnSave": { "source.fixAll.eslint": true }—— 注意是对象,键名带.eslint后缀 - 错误写法:
"editor.codeActionsOnSave": true或"editor.codeActionsOnSave": { "source.fixAll": true }—— 前者被忽略,后者会尝试调所有语言服务器的修复逻辑,可能冲突或报错 - 如果同时用了 Prettier,别开
"source.fixAll",只开"source.fixAll.eslint",再让 ESLint 配置里extends: ["prettier"]统一风格 - 想更保守?可用
"source.fixAll.eslint": "explicit",这样只在右键菜单或快捷键(Ctrl+.)触发修复,避免保存时意外重排 import
eslint.validate 和 eslint.options 必须显式声明 .vue/.tsx 等扩展名
ESLint 默认只检查 .js 文件。Vue、TSX、JSX 这些类型不加声明,插件压根不会扫描对应块,自然修不了。
-
eslint.validate决定哪些语言模式启用检查:["javascript", "typescript", "vue", "typescriptreact"]—— 漏掉typescriptreact,.tsx就不校验 -
eslint.options.extensions决定哪些后缀传给 ESLint CLI:[".js", ".ts", ".vue", ".tsx"]—— 特别是.vue,ESLint 默认不处理它,必须显式加进去 - Vue 单文件组件里
<script setup></script>不生效?确认parserOptions.parser是"@typescript-eslint/parser"(不是已废弃的@typescript-eslint/eslint-parser)
为什么 ESLint 图标不亮 / 控制台报 “No configuration found”
VSCode 不会自动向上查找 .eslintrc.js,它只认当前工作区根目录下的配置文件。常见断点不是配置写错了,而是路径没对上。
- 打开的是 monorepo 根目录,但 ESLint 配置在
packages/my-app里 → 改为用 VSCode 直接打开packages/my-app目录 - 用了
eslint.config.js(Flat Config 新格式),但 ESLint 版本 eslint 和vscode-eslint - 实际用
pnpm,但设置里eslint.packageManager还是默认的"npm"→ 改成"pnpm",否则插件找不到node_modules/.bin/eslint -
.eslintrc.js里有语法错误(比如 Node 不支持可选链、多了一个逗号)→ VSCode 加载失败,控制台报Failed to load config,但编辑器界面不提示
哪些规则其实不能自动修复,别白等
eslint --fix 只能修语法层面可推断的问题,不是所有标红的都能一键删掉。VSCode 保存时调用的就是这个能力,边界非常明确。
- ✅ 可修复:
semi、quotes、indent、no-trailing-spaces、no-unused-vars(部分情况,需配合eslint-plugin-unused-imports) - ❌ 不可修复:
no-console(删console.log算修复,但替换成toast就不行)、complexity(圈复杂度只能报,不能改逻辑)、react-hooks/exhaustive-deps(依赖数组漏项需人工判断) - 快速验证某条规则是否当前可修:光标停在报错行,按
Ctrl+.(Windows/Linux)或Cmd+.(macOS),弹出菜单里出现Fix 'xxx' problem才算真支持 - 不可修复的规则设成
"error"只会持续报错却不修 → 直接设为"off",或换用带安全删除能力的插件
最常被忽略的其实是 editor.formatOnSave: false 这一行——Prettier 和 ESLint 同时开格式化,引号、分号、空行反复打架,表面看是“修复失效”,实则是两个工具在互相 undo。











