prettier在vscode中不生效的主因是未为具体语言绑定格式化器,需在语言专属设置(如"[javascript]")中指定;保存不格式化还需满足editor.formatonsave为true、文件被正确识别语言、且prettier.requireconfig设为true以启用.prettierrc。

为什么装了Prettier插件却按 Shift+Alt+F 没反应?
不是插件没装好,而是 VSCode 根本不知道该用它来格式化当前文件——默认不绑定任何格式化器,哪怕只装了 Prettier。右下角语言模式旁若显示 None 或 ESLint,就说明没生效。
- 必须为具体语言显式指定格式化器,比如
"[javascript]"、"[vue]"、"[json]" - 不能只写
"editor.defaultFormatter": "esbenp.prettier-vscode"在顶层,它只对“未指定语言”的文件生效(几乎不存在) - 打开一个
.js文件后,右键 → “格式化文档” → 点“配置默认格式化程序” → 选Prettier - Code formatter,VSCode 会自动写进[javascript]块里
保存时没自动格式化,editor.formatOnSave 开了也没用?
开了开关只是前提,真正执行还依赖两个条件:当前文件被识别为对应语言 + 该语言已绑定 Prettier。常见失效场景是:文件名没后缀、右下角语言显示 Plain Text、或工作区 .vscode/settings.json 里写了 "editor.formatOnSave": false 覆盖了全局设置。
-
editor.formatOnSave必须为true,且建议写在项目级.vscode/settings.json中,确保团队一致 - Vue 单文件组件中,
<script setup></script>需 Prettier ≥ 2.8.0;旧版本直接跳过 script 区域,看起来像“没格式化” - 若同时启用了
eslint.autoFixOnSave,且没禁用 ESLint 的格式规则,会和 Prettier 抢着改代码,导致保存后样式反复抖动
项目里有 .prettierrc 但规则不生效?
Prettier 插件默认不强制读取配置文件;若没配 prettier.requireConfig: true,它会退回到 VSCode 内置的极简默认值(比如双引号、无分号),而不是你写的 singleQuote: true。
- 在
.vscode/settings.json中加一行:"prettier.requireConfig": true,强制插件只认项目配置 -
.prettierrc和prettier.config.js都可,但后者支持动态逻辑(如根据 Node 版本切规则) - 路径配置很重要:
"prettier.prettierPath": "./node_modules/prettier"可避免插件调用全局 Prettier 导致版本错乱
和 ESLint 一起用,为什么保存后代码被改来改去?
这不是 bug,是职责没切干净:ESLint 在修分号,Prettier 又删掉它,循环往复。现代做法是让 ESLint 只报错,格式化全交给 Prettier。
- 安装
eslint-config-prettier并加到.eslintrc的extends末尾,关掉所有格式类规则 - 不要开
eslint.autoFixOnSave;若需修复逻辑问题,可用"editor.codeActionsOnSave": {"source.fixAll.eslint": true} - 确保
eslint-plugin-prettier仅用于 lint 检查(即作为 ESLint 规则运行),不参与实际格式化动作
Prettier 配置真正的复杂点不在“怎么写规则”,而在于 VSCode 的三层控制:全局设置、工作区设置、语言特定设置——三者优先级不同,且任意一层写错都会静默失效。最稳妥的方式,是把关键项(editor.formatOnSave、[javascript] 绑定、prettier.requireConfig)全放进项目根目录的 .vscode/settings.json 里,并提交到 Git。











