Prettier Formatter for Visual Studio CodePrettier is an opinionated code formatter It enforces a consistent style by parsing your code and re-printing it with its own rules that take the maximum line

Visual Studio Code 的 Prettier 格式化工具

Prettier 是一种有主见的代码格式化工具。它通过解析代码并根据自己的规则重新打印代码来强制执行一致的风格，考虑到最大行长，必要时换行。

JavaScript · TypeScript · Flow · JSX · JSON CSS · SCSS · Less HTML · Vue · Angular HANDLEBARS · Ember · Glimmer GraphQL · Markdown · YAML 你最喜欢的语言是？

构建状态 VS Code Marketplace 下载次数 VS Code Marketplace 安装次数 code style: prettier 在 Twitter 上关注 Prettier

安装 通过 VS Code 扩展安装。搜索 Prettier - Code formatter

Visual Studio Code 市场：Prettier - Code formatter

也可以在 VS Code 中安装：启动 VS Code 快速打开（Ctrl+P），粘贴以下命令，然后按 Enter。

ext install esbenp.prettier-vscode

默认格式化工具 为了确保该扩展程序用于其他已安装的扩展程序之上，请确保在 VS Code 设置中将其设置为默认格式化工具。此设置可以适用于所有语言或特定语言。

{ "editor.defaultFormatter": "esbenp.prettier-vscode", "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } }

如果您想在特定语言上禁用 Prettier，则可以创建一个 .prettierignore 文件，或者您可以使用 VS Code 的 editor.defaultFormatter 设置。

以下将使用 Prettier 除 Javascript 之外的所有语言。

{ "editor.defaultFormatter": "esbenp.prettier-vscode", "[javascript]": { "editor.defaultFormatter": "" } }

以下仅使用 Javascript Prettier。

{ "editor.defaultFormatter": "", "[javascript]": { "editor.defaultFormatter": "esbenp.prettier-vscode" } }

此外，如果您不希望自动格式化特定语言，请禁用保存格式。

{ "[javascript]": { "editor.formatOnSave": false } }

Prettier 解析 此扩展将使用项目本地依赖项中的 prettier（推荐）。当 prettier.resolveGlobalModules 设置为 true 时，扩展程序还可以尝试解析全局模块。如果在项目的依赖项或全局计算机上未安装 prettier，则将使用扩展程序捆绑的版本。

要在项目中安装 prettier 并固定其版本（推荐），请运行：

npm install prettier -D --save-exact

注意：您将被提示确认您是否要加载 Prettier 模块。这样做是为了确保您不会加载不受信任的模块或脚本。

插件 此扩展支持 Prettier 插件，当您使用本地或全局解析版本的 prettier 时。如果您在 package.json 中注册了 Prettier 和插件，则此扩展将尝试注册语言并为内置和插件语言提供自动代码格式化。

配置 有多种选项可用于配置此扩展程序的 Prettier。您可以使用 VS Code 设置、prettier 配置文件或 .editorconfig 文件。VS Code 设置旨在作为后备使用，通常仅用于非项目文件。建议您始终在项目中包含 prettier 配置文件，指定项目的所有设置。这将确保您无论如何运行 prettier - 从此扩展程序、从 CLI 或从另一个带有 Prettier 的 IDE 运行 - 都将应用相同的设置。

使用 Prettier 配置文件设置格式选项是推荐的方法。选项会从文件被格式化的位置开始递归搜索，因此，如果您想将 prettier 设置应用于整个项目，则只需在根目录中设置一个配置即可。也可以通过 VS Code 进行设置 - 但是，这些设置仅适用于运行扩展程序时，而不是在 CLI 或其他 IDE 中运行 prettier 时。

配置默认选项 某些用户可能不希望为每个项目创建新的 Prettier 配置或使用 VS Code 设置。为了设置默认配置，请设置 prettier.configPath。但是，请注意，如果设置了此值，则将始终使用该值，并忽略本地配置文件。

使用方法 使用命令面板（CMD/CTRL + Shift + P）

1. CMD + Shift + P -> 格式化文档 或
2. 选择要美化的文本
3. CMD + Shift + P -> 格式化所选

键盘快捷键 Visual Studio Code 提供了默认的代码格式化键盘快捷键。您可以在 VS Code 文档中了解每种平台的情况。

如果您不喜欢默认设置，可以在 vscode 的键盘快捷键菜单中重新绑定 editor.action.formatDocument 和 editor.action.formatSelection。

保存格式 遵守 editor.formatOnSave 设置。

您可以通过范围设置每种语言的格式保存格式：

// 设置默认值 "editor.formatOnSave": false, // 启用每种语言 "[javascript]": { "editor.formatOnSave": true }

格式所选 格式化选择适用于多种语言，具体取决于 Prettier 本身支持的内容。目前支持以下语言：

javascript javascriptreact typescript typescriptreact json graphql handlebars

格式化文档（强制） 如果您想格式化一个已配置为在 Prettier 中被忽略的文档，因为它在 .prettierignore 文件中或属于通常排除的位置，例如 node_modules，则可以运行“格式化文档（强制）”命令来强制文档格式化。强制模式还将忽略任何 requirePragma 配置，使您可以在未出现 pragma 注释的情况下格式化文件。

Linter 集成 与 linter 集成的推荐方法是让 Prettier 进行格式化，并配置 linter 不处