Prettier 是什么
Prettier 是选项极少的代码格式化器，覆盖 JavaScript、TypeScript、CSS、JSON、Markdown、HTML 等前端常见语言。它几乎不允许调整排版细节（默认行宽 80、缩进 2 个空格、语句结尾保留分号、默认使用双引号，较新版本的尾随逗号默认为 all），从而把格式讨论一次性消除。
基本信息
| 默认值 | printWidth 80、缩进 2 空格、双引号、保留分号 |
|---|---|
| 支持语言 | JS/TS、CSS/SCSS、JSON、Markdown、HTML、Vue 等 |
| 配置位置 | .prettierrc 或 prettier.config.js（也可写在 package.json 的 prettier 段） |
| CI 模式 | prettier --check 只检查不修改 |
常用命令
常用命令
npx prettier --write . # 格式化整个项目
npx prettier --check . # CI 中检查，不改文件
npx prettier --write "src/**/*.{ts,css,md}" # 指定范围
npx prettier --ignore-path .gitignore --write . # 沿用忽略规则落地要点
- 首次全库格式化单独提交：与逻辑改动混在一起会让评审无从下手。
- 忽略文件写清楚：构建产物、生成代码与依赖目录不要进入格式化范围。
- 与检查工具分工：语义规则交给检查器，格式一律交给格式化器，两边不重叠。
- 版本固定在依赖里：不同版本的输出可能有细微差异。
与其它工具的关系
| 搭配 | 做法 | 注意 |
|---|---|---|
| 与 ESLint | 关闭 ESLint 中与格式冲突的风格规则 | 避免两边互相覆盖 |
| 与提交钩子 | 提交前自动格式化改动文件 | 钩子失败要提示安装方式 |
| 与编辑器 | 保存自动格式化 | 先在仓库里确认已统一配置 |
| 与 CI | 仅做检查 | CI 不应自动改代码 |
分工原则：格式归 Prettier，语义规则归 ESLint，谁都不越界，diff 才不会反复震荡。
常见问题排查
- 本地已格式化但 CI 仍报错：确认两边使用的版本与配置一致。
- 保存时格式没有生效：检查编辑器插件是否指向项目内的配置文件。
- Markdown 与表格被重排：纳入范围前先确认团队是否接受这类改动。
- 忽略规则不生效：确认忽略文件的路径相对项目根目录，并传入了正确参数。
- 同一文件被两个工具格式化：确认项目里只保留一个格式化器负责该语言。
Markdown 与 JSON 同样会被格式化：文档类文件纳入范围前先确认团队是否接受这种改动。