启用typescript-eslint的recommendedTypeChecked配置触发配置文件lint报错

问题说明 #

启用@typescript-eslint/recommended-type-checked配置后，即便已设置parserOptions.project，运行ESLint时仍会在检查eslint.config.js文件时报错：@typescript-eslint/await-thenable规则需要生成parserServices。仅启用@typescript-eslint/recommended时无此问题，需要在配置文件中实现让Linter自动跳过检查自身配置文件的效果，无需手动指定lint路径。

解决方案 #

方法1：通过ignores数组直接排除配置文件 #

ESLint 8.23.0及以上版本支持在配置中使用ignores字段指定忽略的文件，直接把eslint.config.js加入忽略列表即可：

import tseslint from '@typescript-eslint/eslint-plugin';
import tsParser from '@typescript-eslint/parser';

export default [
  // 忽略ESLint自身配置文件
  { ignores: ['eslint.config.js'] },
  {
    files: ['**/*.ts', '**/*.tsx'],
    languageOptions: {
      parser: tsParser,
      parserOptions: {
        project: './tsconfig.json',
      },
    },
    plugins: { '@typescript-eslint': tseslint },
    rules: {
      ...tseslint.configs.recommended.rules,
      ...tseslint.configs.recommendedTypeChecked.rules,
    },
  },
];

方法2：针对配置文件单独禁用类型检查规则 #

如果不想完全忽略配置文件，可单独为eslint.config.js设置配置，禁用需要类型检查的规则，或切换回JS解析器：

import tseslint from '@typescript-eslint/eslint-plugin';
import tsParser from '@typescript-eslint/parser';

export default [
  // 针对ESLint配置文件单独设置
  {
    files: ['eslint.config.js'],
    // 禁用所有需要类型检查的规则
    rules: Object.fromEntries(
      Object.keys(tseslint.configs.recommendedTypeChecked.rules).map(rule => [rule, 'off'])
    ),
    // 可选：切换回ESLint默认解析器，避免TS解析器处理JS文件
    languageOptions: {
      parser: 'espree',
    },
  },
  {
    files: ['**/*.ts', '**/*.tsx'],
    languageOptions: {
      parser: tsParser,
      parserOptions: {
        project: './tsconfig.json',
      },
    },
    plugins: { '@typescript-eslint': tseslint },
    rules: {
      ...tseslint.configs.recommended.rules,
      ...tseslint.configs.recommendedTypeChecked.rules,
    },
  },
];

原理说明 #

报错原因是recommended-type-checked中的规则依赖TypeScript类型信息（需要parserServices），但eslint.config.js是JavaScript文件，不会被TS解析器的project配置包含，导致无法生成所需的类型服务。通过忽略该文件或单独配置禁用相关规则，即可解决此问题。

内容的提问来源于stack exchange，提问作者Hoppe