What is Prettier

Prettier 是以一种统一格式约束代码的格式化工具。

它支持的文件类型如下：

• JavaScript
• JSX
• Angular
• Vue
• Flow
• TypeScript
• CSS, Less, and SCSS
• HTML
• Ember/Handlebars
• JSON
• GraphQL
• Markdown, including GFM and MDX v1
• YAML

TIP

不同于 Standard JS 提供了一系列自定义配置供用户选择，Prettier 在代码格式化方面已经规定好了风格，它只暴露极少数的 options 供用户自定义。

Prettier 也不推荐众多开发者围绕代码风格大作文章，因为每个人有自己的观点和爱好。这即是 Prettier 的配置理念 Option Philosophy。

Prettier & Eslint

Prettier 偏向于代码格式化，而 Eslint 偏向于静态代码语法检查。

虽然 Eslint 也能做一些格式化的操作，但是相对 Prettier 来说，就是小巫见大巫了。

而且 Eslint 团队也正在逐渐舍弃格式化功能。

另外，从文件类型来说，Prettier 支持的文件类型多种多样，而 Eslint 倾向于 JS 生态。

Install

由于不同版本的 Prettier 可能风格及内置功能不一致，因此推荐安装时，安装某一确定版本：

npm install --save-dev --save-exact prettier

yarn add --dev --exact prettier

pnpm add --save-dev --save-exact prettier

然后可以在 package.json 中声明：

{
  "scripts": {
    "pretty:write": "prettier . --write"
  }
}

或者利用 npx 直接执行 npx prettier . --write。

这样，就会格式化当前项目下所有 Prettier 可识别的文件。