ESLint 和 Prettier 在 VSCode 中需协同配置:禁用 ESLint 格式化、启用 Prettier 为唯一格式器,通过 eslint-config-prettier 关闭 ESLint 格式规则,并验证警告与自动修复是否分离且准确。

ESLint 和 Prettier 在 VSCode 中能协同工作,但默认配置下几乎必然冲突——关键不是装插件,而是切断 ESLint 的格式化能力,把格式全交给 Prettier。
为什么保存后代码“抖动”或分号忽有忽无
这是典型分工混乱:ESLint 默认启用了 semi、quotes、indent 等格式类规则,而 Prettier 也在同一时刻尝试重写这些位置。VSCode 可能先调 ESLint 格式化一次,再被 Prettier 覆盖,导致光标跳、代码重排、甚至报错反复出现。
- 检查你的
.eslintrc.js或.eslintrc.cjs,确认没手动开启任何格式规则(如"semi": ["error", "always"]) - 必须在
extends数组末尾加入"eslint-config-prettier"—— 顺序很重要,靠后才能覆盖前面的格式规则 - 确保没启用
eslint-plugin-prettier的"prettier/prettier": "error"作为校验项(它适合 CI 检查,不适合编辑器实时保存)
VSCode settings.json 必须显式关闭 ESLint 格式能力
VSCode 默认可能把 ESLint 当作默认格式化器,这会直接和 Prettier 抢活。仅安装插件远远不够,必须手动锁定行为:
生成Blender Python (bpy)脚本,该脚本使用node_groups API和GeometryNodeTree接口程序化地创建几何节点修改器树,用于参数化3D资产生成。
- 设
"editor.defaultFormatter": "esbenp.prettier-vscode"—— 这是唯一允许执行格式化的扩展 - 设
"eslint.format.enable": false—— 显式禁用 ESLint 的格式功能,只保留错误/警告提示 - 保留
"editor.formatOnSave": true,但它现在只触发 Prettier,不再触发 ESLint 格式化 - 重启 VSCode —— 配置变更(尤其是
eslint.format.enable)不重启常不生效
Node 项目推荐的最小可行配置组合
针对纯 Node(非 TypeScript / React / Vue),避免引入无关插件,聚焦可维护性:
-
.eslintrc.cjs内容精简为:module.exports = { root: true, env: { node: true, es2021: true }, extends: ["eslint:recommended", "eslint-config-prettier"], parserOptions: { ecmaVersion: "latest" }, rules: { "no-console": "warn", "no-process-exit": "off" } }; -
.prettierrc用 JSON 格式即可:{"singleQuote": true, "tabWidth": 2, "semi": true, "trailingComma": "none"} - 不建议在 Node 项目中使用
@typescript-eslint/parser或eslint-plugin-react—— 多余依赖会拖慢 lint 速度,且增加配置歧义
验证是否真协同:两个一秒钟测试法
别看插件开了没,要看行为是否对齐:
- 在 JS 文件里写
console.log("test")(假设你设了"no-console": "warn"),保存后 VSCode 底部状态栏应显示 ESLint 警告图标,悬停可见警告 —— 这说明 ESLint 校验仍在工作 - 删掉某行末尾分号,保存,代码应自动补上分号,且 ESLint 不再报
Missing semicolon—— 这说明eslint-config-prettier已生效,且 Prettier 是唯一格式源 - 右键 → “Format Document With…” → 弹出菜单里默认项必须是
Prettier,不能是ESLint或None
最易被忽略的是 eslint.format.enable 默认为 true,不显式设 false 就等于留了个定时炸弹——它不会报错,但会让格式逻辑不可预测。

















