Prettier 是一个广泛使用的代码格式化工具，它可以帮助你保持代码风格的一致性。下面将介绍如何在 ESLint 中集成 Prettier。

安装 Prettier

首先，你需要安装 Prettier。你可以使用 npm 或 yarn 来安装：

npm install --save-dev prettier

或者

yarn add --dev prettier

配置 ESLint 以使用 Prettier

接下来，你需要配置 ESLint 以使用 Prettier。这通常涉及以下步骤：

  1. 创建一个 .prettierrc 文件来定义 Prettier 的配置。
  2. 在你的 ESLint 配置文件中（通常是 .eslintrc.js 或 .eslintrc.json），添加 prettier 插件。
  3. 在 ESLint 配置中启用 prettier 的规则。

例如，在你的 .eslintrc.js 文件中，你可以添加以下内容：

module.exports = {
  plugins: ['prettier'],
  extends: ['plugin:prettier/recommended'],
  rules: {
    'prettier/prettier': 'error',
  },
};

使用 Prettier 格式化代码

现在，每当你在项目中保存文件时，ESLint 会自动运行 Prettier 来格式化代码。如果你需要手动运行 Prettier，可以使用以下命令：

npx prettier --write .

或者

yarn prettier --write .

优势

  • 一致性：Prettier 确保你的代码风格一致，有助于团队协作。
  • 易于阅读：格式化后的代码更易于阅读和维护。
  • 集成：Prettier 可以与其他工具（如 ESLint 和 Git hooks）集成，以自动化代码格式化过程。

Prettier 格式化效果

更多信息，请访问 Prettier 官方文档.

以上内容介绍了如何在 ESLint 中集成 Prettier，希望对你有所帮助。