PyCharm 2025.3 Help

Prettier

Prettier 是一款用于格式化多种语言文件的工具，例如 TypeScript、JavaScript、CSS、HTML、JSON 等。 使用 PyCharm，您可以通过 使用 Prettier 重新格式化 操作格式化所选代码片段以及整个文件或目录。 一旦您在项目中或在计算机上全局安装 Prettier 作为依赖项，PyCharm 就会添加此操作。

您可以配置 Prettier，使其在特定文件发生更改并自动或手动保存更改时重新格式化这些文件，参阅 在保存时自动运行 Prettier。

此外，Prettier 可 设置为默认格式化程序 ，用于特定文件。 每次您使用 Ctrl+Alt+L 重新格式化代码时，它都会对这些文件运行。

了解详情，请参阅 使用 Prettier 重新格式化代码。

开始之前

  1. 请确保您的计算机已安装 Node.js。

  2. 请确保在项目中配置了本地 Node.js 运行时：打开 设置 对话框（Ctrl+Alt+S ），然后转到 语言和框架 | JavaScript 运行时。 Node 运行时 字段显示项目默认的 Node.js 运行时。 了解详情，请参阅 配置本地 Node.js 解释器。

  3. 请确保在 设置 | 插件 页面中， 已安装 选项卡上已启用所需的 JavaScript and TypeScript 和 Prettier 插件。 了解详情，请参阅 管理插件。

安装 Prettier

  1. 打开内置 终端 （Alt+F12）。

  2. 输入以下命令之一：

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

    • npm install --global prettier

了解有关安装模式的更多信息，请参阅 Prettier 官方网站。

在 PyCharm 中配置 Prettier

一旦您按照 如上所述 完成安装，PyCharm 就会启用 Prettier，并添加 使用 Prettier 重新格式化 操作。 要关闭 Prettier，请打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier ，然后选择 禁用 Prettier。

受支持的配置文件格式

PyCharm 可在以下文件类型中识别 Prettier 配置：

  • .prettierrc.json 、 .prettierrc.yml 、 .prettierrc.yaml 或 .prettierrc.json5

  • .prettierrc.js 、 prettier.config.js 、 .prettierrc.mjs 、 prettier.config.mjs 、 .prettierrc.cjs 、 prettier.config.cjs 、 .prettierrc.toml

  • .prettierrc.ts 、 prettier.config.ts 、 .prettierrc.mts 、 prettier.config.mts 、 .prettierrc.cts 、 prettier.config.cts

了解详情，请参阅 Prettier 官方网站。

Prettier 的自动配置

在此模式下，对于每个与 run-for-files 模式匹配的文件：

  • PyCharm 使用与要重新格式化的文件位于同一文件夹或其任一父文件夹中的最近的 node_modules 文件夹里的 Prettier 包。

  • PyCharm 会自动检测最近的 配置文件 并应用其中的设置。

  • PyCharm 会在文件夹树中向上查找 .prettierignore 文件，并使用找到的第一个文件中的设置（如果存在）。

启用 自动 Prettier 配置 时，Prettier 仅应用于相应 package.json 中列出的 Prettier 依赖范围内的文件。 要更改此行为，请选择 手动 Prettier 配置 并选中 将 Prettier 应用于 prettier 依赖范围之外的文件 复选框，了解详情，请参阅 Prettier 的手动配置。

假设您的项目结构如下：

项目结构：仅将 Prettier 应用于 Prettier 依赖范围内的文件

项目根目录中有一个 .prettierrc 配置文件。 还有四个 package.json 文件，其中一个在项目根目录，其他在子项目中。 如您所见，仅在 packages/package_c_with_prettier_dependency 子项目的 package.json 中将 Prettier 列为依赖项。 因此，仅 packages/package_c_with_prettier_dependency/src 中的文件会使用 Prettier 进行格式化。

在任何没有 .idea 文件夹的新项目中，如果在任一 package.json 中将 Prettier 列为依赖项，且项目至少包含一个 Prettier 配置文件，则默认启用 自动 Prettier 配置。

因此，如果您的项目由多个具有不同 Prettier 配置的模块组成，则每个模块都会使用其自身 Prettier 配置文件中的规则（如果存在）。

如果由于某些原因 自动 Prettier 配置 默认未启用，您可以自行启用。

启用 Prettier 自动配置

  1. 打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier ，然后选择 自动 Prettier 配置。

    自动配置 Prettier

  2. 要将 Prettier 自动应用于已保存的文件，请选中 在保存时运行 复选框。

  3. 在 对以下文件运行 字段中，指定文件模式，以便在保存此类文件或调用 重新格式化代码 操作时自动应用 Prettier。

    使用默认模式，Prettier 将应用于任何 JavaScript、TypeScript、JSX、TSX、HTML、Vue 或 Astro 文件。 要重新格式化其他类型的文件或存储在特定文件夹中的文件，请使用 glob 模式 更新默认模式。

    • 例如，要自动重新格式化 CoffeeScript 文件，还请将 coffee 添加到默认模式，如下所示：

      **/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,coffee}

    • 要重新格式化特定文件夹（包括子文件夹）中的文件，请将 **/* 替换为 <path to the folder>/**/*。

      假设您的项目结构如下：

      Prettier：自定义模式。 示例项目结构

      要仅重新格式化 coffee 文件夹中的文件，请按如下方式更新模式：

      coffee/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,coffee}

      因此，文件 reformat.coffee 被重新格式化，而 no_reformatting.coffee 未被重新格式化。

    了解详情，请参阅 Run Prettier automatically on save 和 Set Prettier as default formatter。

Prettier 的手动配置

  1. 打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier ，然后选择 手动 Prettier 配置。

  2. 在 Prettier 包 列表中，选择要使用的 prettier 安装。 如果您遵循标准安装过程，PyCharm 会自动定位 prettier 包，并自动填充该字段。

    配置 Prettier：手动模式

  3. 要 将 Prettier 设为默认格式化程序 ，请选中 在 '重新格式化代码' 操作时运行 复选框。

  4. 要将 Prettier 自动应用于已保存的文件，请选中 在保存时运行 复选框。

  5. 配置 Prettier 的作用域。

配置 Prettier 的作用域

您可以指定文件名模式，用于定义要由 Prettier 自动处理的文件。 您也可以将某些文件添加到 .prettierignore 文件中，从而将其排除在处理之外。

默认情况下， Prettier 不仅应用于存储 prettier 包的模块，还会应用于其他模块，这对于单体存储库很有帮助。

  1. 在 设置 对话框（Ctrl+Alt+S ）中，转到 语言与框架 | JavaScript | Prettier。

  2. 在 对以下文件运行 字段中，指定文件模式，以便在保存此类文件或调用 重新格式化代码 操作时自动应用 Prettier。

    使用默认模式，Prettier 将应用于任何 JavaScript、TypeScript、JSX、TSX、HTML、Vue 或 Astro 文件。 要重新格式化其他类型的文件或存储在特定文件夹中的文件，请使用 glob 模式 更新默认模式。

    • 例如，要自动重新格式化 CoffeeScript 文件，还请将 coffee 添加到默认模式，如下所示：

      **/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,coffee}

    • 要重新格式化特定文件夹（包括子文件夹）中的文件，请将 **/* 替换为 <path to the folder>/**/*。

      假设您的项目结构如下：

      Prettier：自定义模式。 示例项目结构

      要仅重新格式化 coffee 文件夹中的文件，请按如下方式更新模式：

      coffee/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,coffee}

      因此，文件 reformat.coffee 被重新格式化，而 no_reformatting.coffee 未被重新格式化。

    了解详情，请参阅 Run Prettier automatically on save 和 Set Prettier as default formatter。

  3. 指定要使用的 .prettierignore 文件。

    对于每个与 上述指定的模式 匹配的文件，PyCharm 默认会在文件夹树中向上查找 .prettierignore ，并使用找到的第一个。 当您选择 自动 Prettier 配置 时，始终应用此默认方法。

    使用 手动 Prettier 配置 时， 指向 .prettierignore 的路径 字段默认也会显示 Detect the .prettierignore file automatically。 接受此建议，或点击 浏览按钮 并选择要使用的 .prettierignore 。

  4. 默认情况下， Prettier 会自动应用于每个与 上述指定的模式 匹配的文件，无论项目树上层的 node_modules 文件夹是否包含 prettier 包。 这样，您无需在每个子项目中安装 prettier 包，就可以在所有子项目中使用 Prettier。

    要禁止处理没有 prettier 包的子项目中的文件，请选择 手动 Prettier 配置 ，并清除 将 Prettier 应用于 prettier 依赖范围之外的文件 复选框。

Prettier 语言状态小部件

当您打开一个应根据 配置的作用域 由 Prettier 处理的文件时，状态栏会显示 Prettier 小部件图标 Prettier 状态小部件。

Prettier 语言状态小部件

通过此小部件，您可以重启 Prettier 语言服务、打开 Prettier 配置文件进行编辑，或打开 Prettier 设置以更新 Prettier 配置。

Prettier 语言状态小部件 - 操作

  • 要重启 Prettier 语言服务，请点击 重启服务图标。

  • 要打开并编辑 Prettier 配置文件，请点击 编辑配置文件图标。

  • 要更新 在 PyCharm 中的 Prettier 配置 ，请点击 打开设置图标。

  • 如果检测到任何错误，例如，错误的 Node.js 版本、无效的 Prettier 包、插件错误，或 语言服务超时 ，会显示 错误图标。

    将鼠标悬停在 打开设置图标 上以查看包含问题描述的工具提示。

    Prettier 语言状态小部件 - 检测到错误

    点击 打开设置图标 打开 Prettier 配置设置。

为避免浪费系统资源，Prettier 语言服务在一段时间无活动后会因超时而自动停止。 当 Prettier 被调用来重新格式化您的代码或解析配置（例如，当代码样式被修改时）时，即被视为处于活动状态。

设置自定义超时时间

默认超时时间为 5 分钟。

  1. 在主菜单中，转到 工具 | 内部操作 | 注册表 ，或使用 Ctrl+Shift+A 打开 注册表。

  2. 找到 prettier.service.expiration.timeout.ms 键，并在 值 字段中更改默认超时时间。

使用 Prettier 重新格式化代码

  1. 在编辑器中，选择要重新格式化的代码片段。 要重新格式化文件或文件夹，请在 项目 工具窗口 Alt+1 中选择它。

  2. 然后从上下文菜单中选择 使用 Prettier 重新格式化。

您可以配置 Prettier，使其在特定文件发生更改并自动或手动保存更改时重新格式化这些文件，参阅 在保存时自动运行 Prettier。

此外，Prettier 可 设置为默认格式化程序 ，用于特定文件。 每次您使用 Ctrl+Alt+L 重新格式化代码时，它都会对这些文件运行。

此行为可以 在当前项目中 启用，也可以 用于所有新项目。

在保存时自动运行 Prettier

  1. 打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier ，然后选中 在保存时运行 复选框。

  2. 在 对以下文件运行 字段中，指定要在每次保存此类文件时重新格式化的文件集所使用的模式。 您可以接受默认模式，或输入自定义模式。

    使用默认模式，Prettier 将唤醒并处理任何已更新并保存的 JavaScript、TypeScript、JSX、TSX、HTML、Vue、Astro、 .ml 或 CSS 文件。 要重新格式化其他类型的文件或存储在特定文件夹中的文件，请使用 glob 模式 更新默认模式。

    • 例如，要自动重新格式化 sass 和 .scss 文件，还请将 sass, scss 添加到默认模式，如下所示：

      **/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,ml,css,scss,sass}

    • 要重新格式化特定文件夹（包括子文件夹）中的文件，请将 **/* 替换为 <path to the folder>/**/*。

      假设您的项目结构如下：

      Prettier：自定义模式。 示例项目结构

      要仅将 Prettier 自动应用于 src 文件夹中的文件，请按如下方式更新模式：

      src/*.{js,ts,jsx,tsx,cjs,cts,mjs,mts,vue,astro,ml,css}

      因此，文件 dog.ts 在保存时将被重新格式化，而 animal.ts 将保持不变。

粘贴时重新格式化代码片段

默认情况下，新粘贴的代码片段会自动使用 Prettier 重新格式化。 要禁用此行为：

  • 打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier ，然后清除 在粘贴时运行 复选框。

将 Prettier 设为默认格式化程序

  1. 打开 设置 对话框（Ctrl+Alt+S ），转到 语言与框架 | JavaScript | Prettier。

  2. 选择 手动 Prettier 配置 并选择 在 '重新格式化代码' 操作时运行 复选框。 了解更多关于 Prettier 配置的信息，请参阅 选择如何检测 Prettier 包和配置文件。

  3. 在 对以下文件运行 字段中，指定要始终使用 Prettier 重新格式化的文件集所使用的模式。 接受默认模式，或按 配置 Prettier 的作用域 中的说明进行自定义。

在新项目中配置 Prettier 在保存或重新格式化时运行

  1. 转到 文件 | 新建项目设置 | 设置（针对新项目）。 在打开的对话框中，转到 语言与框架 | JavaScript | Prettier。

  2. 使用 在 '重新格式化代码' 操作时运行 和 On save 复选框来指定将触发 Prettier 的操作。

  3. 如有需要，请按照 在保存时自动运行 Prettier 中的说明，在 对以下文件运行 字段中更新默认模式。

最后修改日期： 2025年 12月 2日
PhoneGap 和 CordovaReact 支持