跳至主要内容

使用类型信息进行代码风格检查

一些 typescript-eslint 规则利用了 TypeScript 类型检查 API 的强大功能，可以更深入地洞察您的代码。要利用 TypeScript 的额外功能，您需要对配置文件进行两个小的更改

  1. 将你使用的任何预设配置名称添加 TypeChecked，例如 recommended、strict 和 stylistic。
  2. 添加 languageOptions.parserOptions 来告诉我们的解析器如何为每个源文件找到 TSConfig。
eslint.config.js
export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommended,
  ...tseslint.configs.recommendedTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        project: true,
        tsconfigRootDir: import.meta.dirname,
      },
    },
  },
);
注意

import.meta.dirname 仅在 Node.js >=20.11.0 / >= 21.2.0 中的 ESM 文件中存在。
对于 CommonJS 模块和/或旧版本的 Node.js，使用 __dirname 或其他替代方案。

更详细地

  • tseslint.configs.recommendedTypeChecked 是我们提供的另一个 共享配置。此配置包含推荐的规则，这些规则还需要类型信息。
  • parserOptions.project: true 表示为每个源文件查找最近的 tsconfig.json（参见 Parser#project）。
  • parserOptions.tsconfigRootDir 告诉我们的解析器项目的根目录的绝对路径（参见 Parser#tsconfigRootDir）。
注意

您的 ESLint 配置文件可能会开始收到有关类型信息的解析错误。请参阅 我们的 TSConfig 包含常见问题解答。

完成这些操作后，运行与之前相同的 lint 命令。您可能会看到基于类型信息的新规则报告错误！

共享配置​

如果您在之前的步骤中启用了strict共享配置和/或stylistic共享配置，请确保将它们分别替换为strictTypeChecked和stylisticTypeChecked，以添加其类型检查规则。

eslint.config.js
export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.strict,
  ...tseslint.configs.stylistic,
  ...tseslint.configs.strictTypeChecked,
  ...tseslint.configs.stylisticTypeChecked,
  // ...
);

您可以在我们的规则文档和共享配置文档中了解更多关于 typescript-eslint 提供的规则。

常见问题​

我可以自定义用于类型化 linting 的 TSConfig 吗？​

project 选项可以通过以下方式开启

  • true：始终使用最靠近源文件的 tsconfig.json
  • string | string[]：相对于 parserOptions.tsconfigRootDir 的任何数量的 glob 路径，用于匹配 TSConfig 文件，如果未提供，则使用当前工作目录

例如，如果您使用特定的 tsconfig.eslint.json 进行 linting，您需要指定

eslint.config.js
export default tseslint.config({
  // ...
  languageOptions: {
    parserOptions: {
      project: './tsconfig.eslint.json',
      tsconfigRootDir: import.meta.dirname,
    },
  },
  // ...
});

请参阅@typescript-eslint/parser 文档以了解更多详细信息。

注意

如果您的项目是多包 monorepo，请参阅我们关于配置 monorepo 的文档。

如何为部分文件禁用类型感知 linting？​

您可以将 ESLint 的overrides 配置与我们的disable-type-checked 配置结合使用，以关闭特定文件子集上的类型感知 linting。

eslint.config.js
export default tseslint.config(
  eslint.configs.recommended,
  ...tseslint.configs.recommendedTypeChecked,
  ...tseslint.configs.stylisticTypeChecked,
  {
    languageOptions: {
      parserOptions: {
        project: true,
      },
    },
  },
  {
    files: ['**/*.js'],
    ...tseslint.configs.disableTypeChecked,
  },
);
信息

如果您使用来自其他插件的类型感知规则，您需要手动禁用这些规则或使用它们提供的预制配置来禁用它们。

性能如何？​

类型化规则有一个缺点。通过在您的配置中包含 parserOptions.project，您会承担让 TypeScript 在 ESLint 进行 linting 之前构建您的项目的性能损失。对于小型项目，这需要忽略不计的时间（几秒钟或更短）；对于大型项目，可能需要更长时间。

我们大多数用户并不介意这种成本，因为类型感知静态分析规则的强大功能和安全性值得这种权衡。此外，大多数用户主要通过 IDE 插件使用 lint 错误，这些插件通过缓存不会受到相同的性能损失。这意味着通常他们只在推送之前或通过他们的 CI 运行完整的 lint，在这种情况下，额外的时间通常无关紧要。

我们强烈建议您使用类型感知的代码风格检查，但以上信息是为了您能够做出自己的明智决定而提供的。

故障排除​

如果您在使用过程中遇到问题，请查看我们的 故障排除和常见问题解答页面。