Skip to main content

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


一些 typescript-eslint 规则利用 TypeScript 类型检查 API 的强大功能来提供对代码更深入的了解。 要利用 TypeScript 的额外功能,你需要对配置文件进行两个小更改:

英:Some typescript-eslint rules utilize the awesome power of TypeScript's type checking APIs to provide much deeper insights into your code. To tap into TypeScript's additional powers, there are two small changes you need to make to your config file:

.eslintrc.cjs
/* eslint-env node */
module.exports = {
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:@typescript-eslint/recommended-type-checked',
],
plugins: ['@typescript-eslint'],
parser: '@typescript-eslint/parser',
parserOptions: {
project: true,
tsconfigRootDir: __dirname,
},
root: true,
};
提醒

你的 .eslintrc.cjs 文件可能会开始收到有关类型信息的解析错误。 参见 我们的 TSConfig 包含常见问题解答

更详细地说:

英:In more detail:

  • plugin:@typescript-eslint/recommended-type-checked 是我们提供的另一个 推荐配置。 这一规则包含额外需要类型信息的推荐规则。
  • parserOptions.project 告诉我们的解析器如何找到每个源文件的 TSConfig(true 表示为每个源文件找到最接近的 tsconfig.json
  • parserOptions.tsconfigRootDir 告诉我们的解析器项目根目录的绝对路径(参见 Parser#tsconfigRootDir)。

完成后,运行之前运行的相同 lint 命令。 你可能会看到新规则根据类型信息报告错误!

英:With that done, run the same lint command you ran before. You may see new rules reporting errors based on type information!

指定 TSConfig

可以通过以下任一方式打开 parserOptions.project 选项:

英:The parserOptions.project option can be turned on with either:

  • true: 始终使用最接近源文件的 tsconfig.json
  • string | string[]: 任意数量的 glob 路径,用于匹配相对于 parserOptions.tsconfigRootDir 的 TSConfig 文件,或者当前工作目录(如果未提供)

例如,如果你使用特定的 tsconfig.eslint.json 进行 linting,则需要指定:

英:For example, if you use a specific tsconfig.eslint.json for linting, you'd specify:

.eslintrc.js
module.exports = {
// ...
parserOptions: {
project: './tsconfig.eslint.json',
},
// ...
};

参见 @typescript-eslint/parser 文档了解更多详细信息

英:See the @typescript-eslint/parser docs for more details.

注意

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

常见问题

如何禁用文件子集的类型感知代码检查?

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

英:You can combine ESLint's overrides config in conjunction with our disable-type-checked config to turn off type-aware linting on specific subsets of files.

.eslintrc.js
module.exports = {
extends: [
'eslint:recommended',
'plugin:@typescript-eslint/recommended',
'plugin:@typescript-eslint/recommended-type-checked',
],
plugins: ['@typescript-eslint'],
parser: '@typescript-eslint/parser',
parserOptions: {
project: true,
tsconfigRootDir: __dirname,
},
root: true,
overrides: [
{
files: ['*.js'],
extends: ['plugin:@typescript-eslint/disable-type-checked'],
},
],
};
信息

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

性能如何?

键入的规则有一个问题。 通过在配置中包含 parserOptions.project,你会因要求 TypeScript 在 ESLint 进行 linting 之前构建项目而遭受性能损失。 对于小型项目,这需要的时间可以忽略不计(几秒或更短); 对于大型项目,可能需要更长的时间。

英:Typed rules come with a catch. By including parserOptions.project in your config, you incur the performance penalty of asking TypeScript to do a build of your project before ESLint can do its linting. For small projects this takes a negligible amount of time (a few seconds or less); for large projects, it can take longer.

我们的大多数用户并不介意这笔成本,因为类型感知静态分析规则的功能和安全性值得权衡。 此外,大多数用户主要通过 IDE 插件处理 lint 错误,而通过缓存,不会遭受同样的惩罚。 这意味着通常他们通常只在推送之前或通过 CI 运行完整的 lint,而额外的时间通常并不重要。

英:Most of our users do not mind this cost as the power and safety of type-aware static analysis rules is worth the tradeoff. Additionally, most users primarily consume lint errors via IDE plugins which, through caching, do not suffer the same penalties. This means that generally they usually only run a complete lint before a push, or via their CI, where the extra time often doesn't matter.

我们强烈建议你使用类型感知的 linting,但包含上述信息是为了让你自己做出明智的决定。

英:We strongly recommend you do use type-aware linting, but the above information is included so that you can make your own, informed decision.

我收到错误消息,告诉我 "该文件必须至少包含在所提供的项目之一中"

你使用的是过时版本的 @typescript-eslint/parser。 更新到最新版本以查看此错误消息的更多信息版本,在我们的 故障排除和常见问题解答页面 中进行了解释。

英:You're using an outdated version of @typescript-eslint/parser. Update to the latest version to see a more informative version of this error message, explained in our Troubleshooting and FAQs page.

故障排除

如果你在使用此功能时遇到问题,请查看我们的 故障排除和常见问题解答页面

英:If you're having problems getting this working, please have a look at our Troubleshooting and FAQs page.