根本原因是vs code格式化器绑定、配置优先级和文件作用域未对齐；必须在.vscode/settings.json中分语言显式设置editor.defaultformatter，禁用内置html格式器，并确保.prettierrc.json路径正确、语法合法且含htmlwhitespacesensitivity:"strict"。
团队协作中代码格式化失效，根本原因不是插件没装，而是 VS Code 的格式化器绑定、配置优先级和文件作用域三者没对齐——哪怕只漏掉一个语言块的 editor.defaultFormatter，.vue 或 .html 文件就会走内置格式器，导致保存后风格不一致。
为什么团队里每人保存出来的代码 diff 都不一样
这不是 Prettier 不稳定，是本地配置被多层覆盖：用户设置、工作区 .vscode/settings.json、项目根目录 .prettierrc.json、甚至 package.json 里的 prettier 字段，它们的生效顺序有严格优先级。更常见的是语言专属设置缺失：[html] 和 [vue] 必须单独声明 editor.defaultFormatter，否则 VS Code 默认用内置 HTML 格式器（vscode.html-language-features）处理 <template></template>，而 Prettier 完全不介入。
- 检查方法：打开任意
.vue文件，右下角状态栏看是否显示Prettier；若显示None或Vetur，说明绑定失败 - 冲突高发点：
Vetur默认开启vetur.format.defaultFormatter.html，必须显式设为"prettier"，否则它会抢在 Prettier 前格式化 HTML 块 - 团队陷阱：有人全局安装 Prettier CLI，有人只装了插件没装本地
prettier包，导致prettier.config.js中的路径解析失败，静默回退默认规则
vscode/settings.json 必须写的四类配置
不能只靠顶层 editor.defaultFormatter，必须分层写死。以下配置直接复制进项目根目录的 .vscode/settings.json（不是用户 settings.json），才能确保新成员克隆即用：
- 全局开关（启用保存时格式化）：
"editor.formatOnSave": true - 全局默认格式化器（兜底）：
"editor.defaultFormatter": "esbenp.prettier-vscode" - 语言专属绑定（关键！缺一不可）：
"[javascript]": {"editor.defaultFormatter": "esbenp.prettier-vscode"}、"[typescript]": {"editor.defaultFormatter": "esbenp.prettier-vscode"}、"[html]": {"editor.defaultFormatter": "esbenp.prettier-vscode"}、"[vue]": {"editor.defaultFormatter": "esbenp.prettier-vscode"} - 禁用干扰项：
"html.format.enable": false（关掉 VS Code 内置 HTML 格式器），"vetur.format.defaultFormatter.html": "prettier"（把 Vetur 的 HTML 格式化权交出去）
.prettierrc.json 配置必须满足三个硬条件
VS Code 的 Prettier 插件只认项目根目录下的 .prettierrc.json（或 .prettierrc、prettier.config.js），且不会向上查找父目录。一旦路径或语法出错，就静默失效：
- 文件名必须是
.prettierrc.json（注意开头的点，不是prettier.json） - 内容必须是标准 JSON（不能有注释、末尾逗号、ES6 语法），例如：
{"semi": false, "singleQuote": true, "tabWidth": 2, "printWidth": 100, "trailingComma": "all"} - 如果用了
prettier.config.js，导出方式必须匹配项目模块系统：CommonJS 项目用module.exports = {...}，ESM 项目用export default {...}；混用会导致配置加载失败
格式化前必须验证的两件事
批量格式化前不验证，等于往 Git 里塞噪音 diff。重点不是“能不能格式化”，而是“格式化结果是否符合预期”：
- 先跑一次干运行：
npx prettier --write --dry-run "**/*.{js,ts,vue,html,css}"，看哪些文件会被改、改多少行，避免误触非代码文件（比如dist/或node_modules/） - 格式化后立刻开 Git diff，重点关注是否出现非预期改动：比如
console.log被自动删掉（说明 ESLint 的no-console规则和 Prettier 冲突）、<template></template>属性被强制换行（说明htmlWhitespaceSensitivity没配或配错）
真正容易被忽略的，是 .prettierrc.json 里没配 htmlWhitespaceSensitivity —— Vue 项目里它默认是 "css"，但实际需要 "strict" 才能保证 <template></template> 中的空格和换行不被乱动。这个值不写进配置，Prettier 就按默认行为处理，而默认行为在 Vue 场景下几乎总是错的。
