ESLint与Prettier需协同工作：ESLint管逻辑规范，Prettier管格式化；须安装官方扩展及项目本地依赖（eslint v8+、prettier v3+），配置.eslintrc.cjs禁用格式规则并启用eslint-plugin-prettier，.prettierrc定义格式，VSCode设置中开启formatOnSave和codeActionsOnSave修复，并确保Prettier为默认格式器。
VSCode 里配 ESLint 和 Prettier 不是为了“装插件就完事”，而是要让两者不打架、各司其职：ESLint 负责代码质量与逻辑规范（比如 no-unused-vars），Prettier 负责格式化（缩进、引号、换行）。配错顺序或冲突规则，反而会导致保存时代码反复被改、报红、甚至格式化失效。
确认已安装核心扩展和依赖
缺一不可，且版本需兼容（推荐 ESLint v8+、Prettier v3+）：
- VSCode 扩展：必须装 ESLint（by Dirk Baeumer）和 Prettier（by Esben Petersen）——注意不是“Prettier ESLint”之类合体插件
- 项目本地依赖：
npm install --save-dev eslint prettier eslint-config-prettier eslint-plugin-prettier - 全局安装
eslint或prettier无意义，VSCode 默认优先用项目内二进制
配置 .eslintrc.cjs 让 ESLint 不干涉格式
关键在禁用所有和格式相关的 ESLint 规则，把格式控制权完全交给 Prettier：
module.exports = {
extends: [
'eslint:recommended',
'plugin:prettier/recommended', // 这行会自动启用 eslint-plugin-prettier 并关闭冲突规则
],
plugins: ['prettier'],
rules: {
'prettier/prettier': 'error', // 把 Prettier 错误当 ESLint 错误提示
},
};
⚠️ 常见错误：eslint-config-prettier 必须放在 extends 数组最后；若手动写一堆 quotes: 'off' 类规则，容易漏、难维护。
设置 .prettierrc + VSCode 用户/工作区配置
格式规则只在 .prettierrc 定义，VSCode 设置里不要重复指定（尤其别开 "editor.formatOnSave": true 同时又设 "editor.defaultFormatter": "esbenp.prettier-vscode" 却没关 ESLint 自动修复）：
-
.prettierrc示例（JSON 格式）：{"semi": false,"singleQuote": true,"tabWidth": 2,"printWidth": 100} - VSCode
settings.json（工作区级更安全）：{ "editor.formatOnSave": true, "editor.defaultFormatter": "esbenp.prettier-vscode", "editor.codeActionsOnSave": { "source.fixAll.eslint": true // ✅ 关键：保存时触发 ESLint 自动修复（含 prettier/prettier 报错） }, "eslint.validate": ["javascript", "typescript", "vue"] // 按需加语言 }
⚠️ 若发现保存后引号变双、分号又回来了，大概率是 eslint-plugin-prettier 没生效，或 eslint-config-prettier 位置不对。
遇到 “Prettier not found” 或格式化不触发？查这三处
这类问题几乎都出在路径或作用域上：
- 打开命令面板（
Ctrl+Shift+P），运行Developer: Toggle Developer Tools，看 Console 是否有Cannot find module 'prettier'——说明 VSCode 没找到项目内的prettier，检查node_modules是否存在、是否在工作区根目录下 - 右下角状态栏点击格式化器名称，确认当前激活的是
Prettier而非ESLint或None - 打开一个
.js文件，按Ctrl+Shift+P→Format Document With...，看列表里是否有Prettier选项；没有则插件未正确识别项目配置
真实场景中，最常被忽略的是：项目用了 pnpm/yarn 2+，但 VSCode 启动时没走正确的 shell 环境，导致找不到本地 node_modules/.bin 下的可执行文件。
