VSCode中Prettier无反应,主因是未设为默认格式化器或被配置覆盖;需检查language-specific defaultFormatter、formatOnSave设置、配置文件语法及语言ID匹配。

VSCode里Prettier装了却没反应,90%的情况不是插件坏了,而是它根本没被调用——要么没被指定为格式化器,要么被其他设置悄悄关掉了。
检查 editor.defaultFormatter 是否绑对了语言
Prettier不会自动接管任何文件类型。VS Code 默认用内置的 vscode.typescript-language-features 处理 JS/TS,除非你明确告诉它:“这个语言归 esbenp.prettier-vscode 管”。
- 打开设置(
Ctrl+,),搜default formatter,分别点开JavaScript › Default Formatter和TypeScript › Default Formatter,下拉选esbenp.prettier-vscode - 对
.html、.vue、.svelte这类非标准语言 ID 的文件,必须在settings.json里手动加语言块:"[html]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } - 右键文件 →
Format Document With…,如果列表里压根没Prettier,说明绑定失败;如果点了没反应,可能是插件版本太旧或没启用
确认 formatOnSave 没被工作区配置覆盖
全局设了 "editor.formatOnSave": true 没用,只要项目根目录下 .vscode/settings.json 里写了 "[javascript]": { "editor.formatOnSave": false },JS 文件就永远不格式化。
- 按
Ctrl+Shift+P→Preferences: Open Workspace Settings (JSON),逐行检查有没有显式关闭formatOnSave - 如果只想对某类文件启用,必须写成语言专属形式,比如:
"[typescriptreact]": { "editor.formatOnSave": true },不能只写全局"editor.formatOnSave": true - 右下角状态栏看当前语言模式(如显示
Plain Text而不是JavaScript),模式不对,formatOnSave直接跳过
排查 prettier.config.js 或 .prettierrc 解析失败
Prettier 遇到配置文件语法错误,不报错、不提示,直接静默退出——看起来像“失效”,其实是连规则都没读进去。
-
.prettierrc必须是合法 JSON:键名和字符串值都得用双引号,不能有注释、不能有尾随逗号;推荐改用prettier.config.js(支持 JS 语法和注释) - 运行
npx prettier --debug-check index.js,它会精准指出哪一行、哪个键出错(比如trailingcomma拼错,或endOfLine值写成"LF"而非"lf") - 检查
prettier.requireConfig设置:如果设为true但项目里没配文件,Prettier 就拒绝工作;开发阶段建议保持false
留意 HTML/React 文件的特殊要求
HTML 文件格式化失败,常因标签语法错误(比如 没闭合)触发解析中断;React 文件则需额外绑定 javascriptreact 语言 ID。
- 错误信息里出现
Unexpected closing tag "span",说明第 48 行 HTML 结构不合法,先修语法再试格式化 - React 文件要单独配:
"[javascriptreact]": { "editor.defaultFormatter": "esbenp.prettier-vscode" },否则默认走javascript规则,JSX 可能不生效 - Vue/Svelte 文件依赖对应语言插件(如 Volar),若这些插件也启用了格式化,必须关掉它们的
format功能,否则和 Prettier 冲突
最麻烦的其实是多根工作区或 monorepo 场景:Prettier 只往上找第一个配置文件,而不是工作区根目录;某个子包缺 prettier.config.js,它就直接跳过——这点很容易被忽略。











