Prettier 不生效的根本原因是 VSCode 未为每种语言（如 javascript、typescript、vue）单独设置 esbenp.prettier-vscode 为默认格式化器，且易受 ESLint、.editorconfig 或插件冲突影响。
为什么 prettier 总是不生效，或者只格式化部分文件
根本原因通常是 VSCode 没有把 prettier 设为指定语言的默认格式化工具，而是让 ESLint、TypeScript 自带格式器或其它插件“抢了活”。VSCode 默认按语言（如 javascript、typescript、vue）分别配置格式化器，不是全局开关。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 打开 VSCode 设置（
Cmd+,或Ctrl+,），搜索default formatter - 对每种目标语言单独设置：点击「Edit in settings.json」，添加类似这样的条目：
"[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[typescript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" }, "[vue]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } - 别只配
"editor.defaultFormatter"顶层项——它不生效，VSCode 不认这个写法 - 如果项目用
.prettierrc，确保它放在项目根目录，且文件名拼写准确（.prettierrc、.prettierrc.json、prettier.config.js都行，但大小写和扩展名必须匹配）
formatOnSave 开了却没反应？检查这三处冲突点
常见错误现象：保存后代码纹丝不动，或者只缩进变、分号没加、单双引号没统一——大概率是其他插件或设置在干扰。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 确认
"editor.formatOnSave": true在工作区设置（.vscode/settings.json）中，而非用户级设置；工作区优先级更高，也更可靠 - 关掉可能冲突的设置：
"editor.codeActionsOnSave": { "source.fixAll": true }—— 这会触发 ESLint 自动修复，和 Prettier 格式化打架 - 禁用或卸载冗余插件：比如
JavaScript Booster、Beautify、旧版Prettier插件（确保只装esbenp.prettier-vscode官方版）
Vue / SFC 文件里 <script></script> 和 <template></template> 格式化不一致
Vue 单文件组件默认被识别为 vue 语言，但 Prettier 对 <template></template> 的 HTML 部分、<script></script> 的 JS/TS 部分、<style></style> 的 CSS 部分，需要分别启用解析器支持。缺一个，对应区块就原地躺平。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 确保已安装
prettier-plugin-vue（v4+ 版本）：npm install --save-dev prettier-plugin-vue
-
.prettierrc中显式启用插件："plugins": ["prettier-plugin-vue"]
- VSCode 设置里不要给
vue单独配"editor.defaultFormatter"后又去配"[html]"或"[javascript]"—— 这会导致<template></template>被 HTML 格式器处理，和 Prettier 规则冲突
团队协作时格式化结果不一致，问题往往出在 prettier 版本或配置继承上
本地跑的是 Prettier v3.2，CI 里跑的是 v2.8，或者有人用 prettier.config.js 动态导出配置，而 VSCode 只读静态 JSON —— 这些都会导致格式化行为漂移。
实操建议：
立即学习“前端免费学习笔记（深入）”；
- 锁定版本：在
package.json的devDependencies中固定prettier版本（如"prettier": "3.2.5"），避免^导致升级后规则变更 - 拒绝动态配置：不用
prettier.config.js返回函数，改用.prettierrc.json；VSCode 的插件不执行 JS 配置文件里的逻辑 - 加一条脚本到
package.json："format": "prettier --write \"src/**/*.{js,ts,vue,css,scss}\""，CI 和本地统一走 CLI，不依赖编辑器行为
最易被忽略的一点：Prettier 的 semi、singleQuote 等选项，一旦写在 .editorconfig 里，VSCode 会优先读它并覆盖 Prettier 配置——删掉 .editorconfig 里所有和格式相关的字段，只留编码、换行符等基础项。
