vscode保存时自动修复需手动配置settings.json中的editor.codeactionsonsave为{"source.fixall.eslint": true}等对应键,而非仅安装插件;必须确保本地eslint存在、配置文件被正确识别,且规则本身标记为✅fixable,否则即使报错也不会自动修复。

VSCode 保存时自动修复靠的是配置,不是插件本身
装了 ESLint 或 Ruff 插件 ≠ 自动修复生效。VSCode 默认关闭所有自动修复行为,必须手动在 settings.json 中启用对应触发项,否则插件只报错不修。
常见错误现象:右下角显示 ESLint 图标、代码有波浪线提示,但 Ctrl+S 后毫无反应——大概率是漏配 editor.codeActionsOnSave。
- 不要只在图形界面勾选 “Format on Save”,那是格式化(如 Prettier),和 ESLint 的
fix是两套机制 -
editor.codeActionsOnSave必须显式写成对象形式,不能只开"source.fixAll": true(会冲突) - JavaScript/TypeScript 项目必须配
"source.fixAll.eslint": true;Python 项目推荐配"source.fixAll": true(Ruff 默认兼容该键)
ESLint 自动修复不生效?先查这三件事
即使配置写对了,也可能卡在底层链路。VSCode 的 ESLint 插件不自带引擎,它只是调用你项目里的 node_modules/.bin/eslint。
- 运行
npx eslint --version,确认本地已安装且版本 ≥ 8.56.0(新配置格式支持前提) - 打开命令面板(Ctrl+Shift+P),执行
ESLint: Show Output Channel,看输出里有没有Cannot find module或Failed to load config - 右下角点 ESLint 图标,如果显示
Using globally installed ESLint,说明 VSCode 没识别到项目根目录——检查是否用“文件 → 打开文件夹”打开了正确路径
哪些规则能自动修?别指望它改逻辑
ESLint 只修标记为 ✅ Fixable 的规则,比如 semi、quotes、no-trailing-spaces;但 no-console 默认只删语句,react-hooks/exhaustive-deps 完全不可修。
- 快速验证:在报错行按 Ctrl+.(Windows/Linux)或 Cmd+.(macOS),弹出菜单里出现
Fix 'xxx' problem才表示当前规则可修 - 规则配置必须是数组形式:
"semi": ["error", "always"],写成"semi": "error"在某些版本中会禁用修复能力 - 若想修
no-unused-vars,需额外装eslint-plugin-unused-imports并在配置中启用对应 rule
和 Prettier 冲突怎么办?别共用 formatOnSave
ESLint 和 Prettier 都能处理缩进、引号、分号,但修复逻辑不同。同时启用 editor.formatOnSave 和 source.fixAll.eslint 会导致保存时代码来回跳、甚至报错。
- 推荐方案:关掉
editor.formatOnSave,只留editor.codeActionsOnSave调 ESLint 修复;格式化交给提交前钩子(如 lint-staged + prettier --write) - 如果非要共存,必须禁用 Prettier 的格式化规则,加
"prettier/prettier": "off"到 ESLint 配置,并确保eslint-config-prettier已启用 - Stylelint 用户同理:CSS 类项目要配
"source.fixAll.stylelint": true,且关掉editor.formatOnSave避免与 Prettier 冲突











