跳至主要内容

格式化怎么办？

我们建议不要使用 ESLint 进行格式化。我们建议使用 Prettier、dprint 或等效工具。

格式化程序与代码检查器​

格式化程序是用于验证和纠正代码中空格问题的工具，例如空格和换行符。格式化程序通常运行速度很快，因为它们只关心更改空格，而不是代码逻辑或命名。

代码风格检查器是用于验证和纠正代码中逻辑和非空格风格问题的工具，例如命名一致性和错误检测。代码风格检查器通常需要几秒钟或更长时间才能运行，因为它们将许多逻辑规则应用于代码。

使用代码风格检查器作为格式化程序的问题​

代码风格检查器旨在在一个解析、检查、报告、修复的循环中运行。这意味着在代码风格检查器能够修复代码中的格式问题之前，需要完成很多中间工作。

此外，代码风格检查器通常独立运行每个规则。这会导致一些问题，例如

  • 任何两个代码风格检查规则都不能共享配置，这意味着一个代码风格检查规则的修复程序可能会引入另一个代码风格检查规则的修复程序的违规（例如，一个代码风格检查规则可能会使用不正确的缩进字符）。
  • 代码风格检查规则的修复程序可能会冲突（应用于相同的代码范围），迫使代码风格检查器执行额外的循环以尝试将修复程序应用于一组干净的代码。

这些问题会导致代码风格检查器运行速度变慢，这在启用类型检查的项目中会更加严重。使用代码风格检查器进行格式化也远不如专门的格式化程序一致，也无法处理边缘情况。因此，与格式化相关的代码风格检查规则的维护成本通常非常高。

现代格式化程序，例如 Prettier，其架构方式是将格式应用于所有代码，无论原始格式如何。这种设计使格式化程序能够以比代码风格检查器低得多的维护成本，实现更全面、更一致的格式化。

建议使用 - Prettier​

typescript-eslint 和 ESLint 核心都没有在任何推荐的预设中启用任何与格式相关的规则。但是，一些第三方插件配置可能仍然会启用这种不良做法。

如果您在 ESLint 配置中看到启用了格式化规则，我们建议您使用 eslint-config-prettier 在您的 ESLint 配置中禁用格式化规则。然后，您可以单独配置您的格式化程序，而不是 ESLint。

通过将其添加到 extends 的末尾来使用此配置

eslint.config.js
// @ts-check

import eslint from '@eslint/js';
import someOtherConfig from 'eslint-config-other-configuration-that-enables-formatting-rules';
import prettierConfig from 'eslint-config-prettier';
import tseslint from 'typescript-eslint';

export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommended,
  ...someOtherConfig,
  prettierConfig,
);

请注意，即使您使用除 prettier 之外的格式化程序，您也可以使用 eslint-config-prettier，因为它专门关闭所有格式化规则。

eslint-plugin-prettier​

eslint-config-prettier 与 eslint-plugin-prettier 不同。

  • 配置仅禁用来自核心和其他插件的规则。
  • 插件在 ESLint 中加载并运行 Prettier。

在 ESLint 中运行 Prettier 可能很慢：请参阅 性能故障排除 > eslint-plugin-prettier。但是，由于它没有在 ESLint 中重新实现 Prettier 的逻辑，因此关于使用 linter 进行格式化的注意事项也不适用于 eslint-plugin-prettier。

ESLint 核心和格式化​

大多数 lint 规则属于两到三类之一

  • 逻辑：关心代码运行时行为中的逻辑的规则（例如缺少 await 或无效的逻辑检查）。
  • 风格：关心风格问题的规则，这些问题会影响代码的运行时行为，但通常不会影响逻辑。这些主要围绕命名或使用哪些大致等效的语法结构（例如函数声明与箭头函数）。
    • 格式化：仅关心琐事（分号、空格等）的风格规则，不会影响代码的运行时行为。这些规则与专门的格式化程序（如 Prettier）冲突。

根据 ESLint 2020 年规则策略变更博客文章，ESLint 本身已不再使用风格规则，包括格式化规则

风格规则已冻结 - 我们不会再向风格规则添加任何选项。我们已经了解到，没有办法满足每个人的个人喜好，而且大多数规则已经有很多难以理解的选项。风格规则是与间距、约定以及通常不会突出显示错误或更好方法的任何内容相关的规则。

我们反映了 ESLint 团队不再使用格式化和风格规则的举措。除了错误修复之外，不会接受任何新的格式化或风格相关的拉取请求到 typescript-eslint。

注意

The stylistic 配置 并没有被弃用或不推荐使用。我们将继续包含这些配置及其规则，以帮助在可预见的未来强制执行与 TypeScript 相关的样式一致性。

eslint-stylistic​

使用综合格式化程序进行格式化的缺点是它会严格地将意见应用于代码。虽然您可以 忽略 Prettier 中的代码 和其他格式化程序，包括使用 // prettier-ignore 注释 的内联格式化程序，但格式化程序比 lint 规则更具主观性。

The eslint-stylistic 项目提供了一个包含格式化和样式规则的 ESLint 插件。如果您强烈希望不使用专用格式化程序，该插件可以充当您的格式化程序。

查看 ESLint Stylistic > Why? 以了解有关该项目动机的更多详细信息，以及 ESLint Stylistic > Getting Started 以了解如何设置它。