包含的tsconfig文件上的ESLint抛出错误

Question

我有以下存储库结构：

cypress文件夹

• .eslintrc.js
• tsconfig.json
• basic.spec.ts

src文件夹

.eslintrc.js

tsconfig.base.json

tsconfig.json

我的目的是只为src文件夹设置根src，.eslintrc.js也是如此。然后，我尝试为tsconfig.json文件夹配置.eslintrc.js和cypress文件夹。但是，在运行ESLint时会出现以下错误：

Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser.
The file does not match your project config: cypress\basic.spec.ts.
The file must be included in at least one of the projects provided.eslint

下面是配置文件的一些片段：

tsconfig.base.json

{
    "compilerOptions": {
        "target": "es5",
        "lib": ["dom", "dom.iterable", "esnext"],
        "allowJs": false,
        "skipLibCheck": true,
        "strict": true,
        "forceConsistentCasingInFileNames": true,
        "noEmit": true,
        "esModuleInterop": true,
        "module": "esnext",
        "moduleResolution": "node",
        "resolveJsonModule": true,
        "isolatedModules": true,
        "jsx": "preserve",
        "incremental": true,
        "removeComments": true,
        "allowUnreachableCode": false,
        "allowUnusedLabels": false,
        "alwaysStrict": true,
        "noFallthroughCasesInSwitch": true,
        "noImplicitAny": true,
        "noImplicitOverride": true,
        "noImplicitReturns": true,
        "noImplicitThis": true,
        "noPropertyAccessFromIndexSignature": true,
        "noUncheckedIndexedAccess": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "baseUrl": "./",
        "paths": {
            "@/containers/*": ["src/components/containers/*"],
            "@/layout/*": ["src/components/layout/*"],
            "@/ui/*": ["src/components/ui/*"],
            "@/utils/*": ["src/utils/*"],
            "@/images/*": ["public/images/*"],
            "@/models/*": ["src/models/*"],
            "@/data/*": ["src/data/*"],
            "@/hooks/*": ["src/hooks/*"]
        },
        "typeRoots": ["./node_modules/@types", "./@types"]
    }
}

tsconfig.json文件：

{
    "extends": "./tsconfig.base.json",
    "include": ["next-env.d.ts", "src/**/*.ts", "src/**/*.tsx", "tests/**/*.ts"],
    "exclude": ["node_modules"]
}

.eslintrc.js文件：

module.exports = {
    root: true,
    env: {
        browser: true,
        es2021: true,
    },
    extends: [
        'eslint:recommended',
        'next/core-web-vitals',
        'plugin:@typescript-eslint/recommended',
        'plugin:import/typescript',
        'prettier',
    ],
    parserOptions: {
        ecmaFeatures: {
            jsx: true,
        },
        ecmaVersion: 12,
        project: 'tsconfig.json',
        sourceType: 'module',
    },
    plugins: ['@typescript-eslint', 'unused-imports', 'react-hooks', 'node'],
};

cypress/tsconfig.json文件：

{
    "extends": "../tsconfig.json",
    "compilerOptions": {
        "isolatedModules": false,
        "types": ["cypress"]
    },
    "include": ["../node_modules/cypress", "./**/*.ts"],
    "exclude": []
}

cypress/.eslintrc.js文件：

module.exports = {
    root: true,
    env: {
        es2021: true,
    },
    extends: [
        'eslint:recommended',
        'plugin:@typescript-eslint/recommended',
        'plugin:import/typescript',
        'prettier',
    ],
    parserOptions: {
        ecmaVersion: 12,
        project: './tsconfig.json',
        sourceType: 'module',
    },
    plugins: ['@typescript-eslint', 'unused-imports', 'node'],
};

所以我不明白为什么会出现错误，因为basic.spec.ts包含在cypress/tsconfig.json文件中。

Answer 1

所以问题是，默认情况下，ESLint会检测当前工作目录作为根文件夹。因此，这导致ESLint检测根tsconfig.json。通过在cypress/.eslintrc.js文件中执行解决问题：

parserOptions: {
        ecmaVersion: 12,
        project: './tsconfig.json',
        tsconfigRootDir: 'cypress',
        sourceType: 'module',
},

(也可以通过将项目值设置为cypress/tsconfig.json来解决)

如需更多参考：https://github.com/typescript-eslint/typescript-eslint/issues/4732