解决VSCode安装Prettier后与ESLint冲突的具体方案-VSCode-PHP中文网

必须禁用ESLint格式化权限，仅保留报错功能，所有排版交由Prettier执行：在.eslintrc.js的extends末尾添加"prettier"，安装eslint-config-prettier，VSCode中设"editor.defaultFormatter"为"esbenp.prettier-vscode"、"eslint.format.enable": false，并启用"editor.codeActionsOnSave": {"source.fixAll.eslint": true}。

解决vscode安装prettier后与eslint冲突的具体方案

ESLint 和 Prettier 冲突不是插件装错了，而是 VSCode 同时让两个工具改同一行代码——必须切断 ESLint 的格式化权限，只留它报错，所有排版动作交给 Prettier。

为什么保存后代码反复被改、波浪线闪个不停

典型现象是：你按 Ctrl+S，const a = 1 被 Prettier 加上分号变成 const a = 1;，ESLint 立刻标红 “Missing semicolon”。这不是 bug，是 ESLint 还在检查 semi、quotes、indent 这类纯格式规则，而它看到的“当前代码”和 Prettier 刚写入的不一致，缓存没同步。

根本原因不是版本不兼容，而是 eslint-config-prettier 没生效，或没放在 .eslintrc.js 的 extends 数组末尾
VSCode 默认开启 eslint.format.enable（值为 true），意味着 ESLint 插件会主动监听保存并尝试格式化——哪怕你已指定 Prettier 为默认格式器
如果同时开了 editor.formatOnSave 和 eslint.autoFixOnSave，两者会轮流覆盖对方结果，导致缩进崩、引号乱、Vue 的 setup() 被拉成一行

如何配置 .eslintrc.js 让 ESLint 彻底不管格式

目标是让 ESLint 只报 undefined is not a function 这类真问题，不报 Expected indentation of 2 spaces but found 4 这种风格问题。

安装依赖：npm install --save-dev eslint-config-prettier eslint-plugin-prettier
在 .eslintrc.js 的 extends 数组里，把 "prettier" 放在**最后一项**（顺序错误会导致前面的配置如 airbnb 或 plugin:node/recommended 把它覆盖掉）
删掉所有手动写的格式类 rule，比如 "semi": ["error", "always"]、"indent": ["error", 2]、"quotes": ["error", "single"] —— 留着就是埋雷
显式加一条："prettier/prettier": "error"，让 ESLint 把 Prettier 格式错误也标出来，但不自己修

VSCode 设置里必须关掉 ESLint 的 auto-fix

很多人配了插件就以为完事，其实 VSCode 不会自动协商谁来动代码。关键开关就在设置里。

VSCode

避免常见的 VSCode 错误——设置冲突、调试器配置和扩展冲突。

下载

搜索 eslint.format.enable，设为 false（这是隐形冲突源，默认是 true）
确认 editor.formatOnSave 是 true，且 editor.defaultFormatter 明确设为 esbenp.prettier-vscode
必须开 editor.codeActionsOnSave：{"source.fixAll.eslint": true} —— 这条才真正让 ESLint 在保存时调用 Prettier 去落地修复；只开 formatOnSave 不开这个，格式错误只会标红不修正
验证方式：右键编辑器 → “Format Document With…” → 看默认项是不是 Prettier - Code formatter，而不是 Configure Default Formatter…

项目级配置优先，别只靠 VSCode 设置

.prettierrc 只对 Prettier 生效，.eslintrc.js 里的格式规则再怎么调，只要没被 eslint-config-prettier 关掉，就会和 Prettier 打架。

根目录放 .prettierrc（不要只靠 VSCode 用户设置或 package.json 里的 prettier 字段），内容示例：
```
{
  "semi": false,
  "singleQuote": true,
  "tabWidth": 2,
  "printWidth": 80
}
```
Node 项目如果用了 eslint-plugin-import，注意它的 import/order 规则可能和 Prettier 的 printWidth 冲突（前者要求字母序，后者可能折行），建议关掉或用 eslint-config-prettier/import
团队用 TypeScript 的话，加一句："typescript.preferences.includePackageJsonAutoImports": "auto"，避免类型导入干扰 ESLint 缓存

真正容易被忽略的是配置加载顺序和作用域边界：.prettierrc 只对 Prettier 生效，eslint-config-prettier 的禁用效果只在 extends 数组末尾才可靠，而 VSCode 的 editor.defaultFormatter 必须写死——任何一层漏配，都会让代码在保存瞬间抖动、Git 提交里全是空格变更。