VSCode中ESLint与Prettier冲突本质是职责未分离:需禁用ESLint所有格式规则(如semi、quotes、indent),通过eslint-config-prettier统一交由Prettier处理格式,并在VSCode中设Prettier为默认格式化器、关闭ESLint自动修复,确保二者各司其职。

VSCode 里代码风格不统一,不是靠“手动调格式”解决的,而是靠 eslint、prettier、ruff 这类工具在保存时自动触发修复 —— 但前提是它们没被配错、没互相打架、也没被 VSCode 忽略。
为什么 Ctrl+S 没触发修复?检查这三处硬性条件
自动修复不是“装了插件就生效”,它依赖三个环节同时就位:
-
editor.codeActionsOnSave必须显式启用"source.fixAll.eslint"(或source.fixAll.ruff等),仅开formatOnSave不管用 - 对应语言的 Linter 必须被 VSCode “识别到”:比如 JS/TS 项目要确保
eslint.validate列表里包含"javascript"或"typescript",Vue 项目还得加"vue" - 项目根目录必须存在有效配置文件(如
.eslintrc.cjs、.prettierrc、pyproject.toml),且其中至少有一条规则是“可修复”的(例如quotes: ["error", "single"]或line-ending = "lf")
常见现象:Ctrl+S 后没反应,但打开命令面板(Ctrl+Shift+P)搜 ESLint: Fix all auto-fixable Problems 却能成功 —— 这说明工具本身可用,只是保存钩子没挂上。
eslint 和 prettier 一起用,为什么越修越乱?
冲突根源在于两者都试图控制“格式”:ESLint 的 quotes、semi、indent 规则和 Prettier 的 singleQuote、semi、tabWidth 直接重叠。VSCode 不知道听谁的,结果就是反复格式化、报红、缩进错乱。
- 正确做法:用
eslint-config-prettier彻底禁用 ESLint 的所有格式类规则,只留逻辑检查(如no-unused-vars) - 再通过
eslint-plugin-prettier把 Prettier 的检查结果转成 ESLint 错误,统一走source.fixAll.eslint修复入口 - VSCode 设置里只保留一个格式器:
"editor.defaultFormatter": "esbenp.prettier-vscode",且"editor.formatOnSave"必须为false—— 否则会和 ESLint 的修复逻辑抢执行权
验证是否生效:删掉一行末尾分号,保存后应自动补上;把双引号改成单引号,也应自动修正。如果只动了一样而另一样没变,说明某处规则还没关干净。
Python 项目该选 pylint、flake8 还是 ruff?
选型核心不是“谁功能多”,而是“谁在保存时真能快速修复”:
-
ruff是当前最优解:Rust 编写,毫秒级响应,支持 90%+ 的flake8规则,还能修复unused-import、undefined-name等问题;配置只需一个pyproject.toml,无需额外插件 -
flake8本身不带修复能力,得靠autopep8或black配合,链路长、易出错;pylint修复粒度粗(常整块重写函数),且启动慢,不适合保存即修场景 - VSCode 中启用
ruff自动修复,关键设置是:"ruff.enable": true和"editor.codeActionsOnSave": { "source.fixAll.ruff": true }
注意:ruff 默认不检查未使用变量(U100),需在 pyproject.toml 显式开启:select = ["U"],否则 import os 后没用到也不会报错。
团队成员配置不一致,怎么锁死?
靠个人设置永远管不住,必须靠项目级强制:
- 在项目根目录放
.vscode/settings.json,内容只保留 linting 相关项(如codeActionsOnSave、defaultFormatter),禁止用户覆盖 - 用
editor.settingsSync同步插件列表,但不要同步用户级settings.json—— 否则本地偏好会冲掉项目规则 - 最关键的兜底:Git 提交前用
pre-commit+ruff check --fix或eslint --fix强制跑一遍,CI 再加一道--check校验,不合规直接拒收
真正容易被忽略的点是:VSCode 的 codeActionsOnSave 修复行为,在某些语言(比如 Vue 的 <template> 块)中默认不生效,必须在设置里明确加上 "vue" 到 eslint.validate 列表,否则模板里的引号、空格问题永远修不了。


















