How to fix eslintrc The file does not match your project config?

Question

In my typescript project, I am using eslint. The files below are in the root, and I have also subfolders /dist and /src.

eslintrc.js

module.exports = {
  root: true,
  parser: '@typescript-eslint/parser',
  parserOptions: {
    tsconfigRootDir: __dirname,
    project: ['./tsconfig.json'],
  },
  rules: {
    strict: 'error',
    semi: ['error', 'always'],
    'no-cond-assign': ['error', 'always'],
  },
  plugins: ['@typescript-eslint'],
  extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:@typescript-eslint/recommended-requiring-type-checking',
  ],
}

tsconfig.json

{
  "compilerOptions": {
    "outDir": "dist",
    "noImplicitAny": true,
    "moduleResolution": "Node",
    "resolveJsonModule": true,
    "module": "ES2020",
    "target": "ES2020",
    "lib": ["ES2020"],
    "allowJs": false,
    "alwaysStrict": true
  },
  "include": ["src"]
}

the word module on top has a red line with this error

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

How can I fix this?

Answer 1

Update your eslintrc.js to include:

ignorePatterns: ['.eslintrc.js']

Answer 2

What is this error about?

The annoying error is basically saying the file eslintrc.js itself is both:

1. Found by ESLint, but
2. Doesn't match the list of files it's supposed to lint

So, ESLint doesn't know what to do and freaks out!

Note that while this file doesn't include your codes, you should decide whether you want this file to be linted (e.g. for tab vs space, or double quote vs single quote,) or not.

---

What should be done?

You can omit either (1) or (2) from the conflicting situation above.

Solution 1: Tell ESLint to ignore the file

It's easier. Just add the name of the file (e.g. .eslintrc.js) to .eslintignore.

You can also see case 1.3 of my answer, here for different ways it can be done.

• Pros: Quick. Easy. Painless.
• Cons: The formatting of this file can become inconsistent with other files in terms of tab/space or quotes style.

Solution 2: Tell ESLint to lint this file (Preferred)

Typescript-ESLint gets the list of files to include from tsconfig.json via parserOptions > project.

So, you can either add the file to the existing tsconfig.json (Solution 2.1) or create a secondary tsconfig.eslint.json to include files like this, that you want to be linted by typescript-eslint, but not necessarily processed by the Typescript compiler.

• Pros: This file, and other similar .js configs will also be included for lining and keeping everything consistent.
• Cons: You might not want these configs files to be linted. Also, it takes a bit extra work anyway.

Solution 2.1: add it to the existing tsconfig.json

// in tsconfig.json ...

    "include": [
        ".eslintrc.js",
        // ...
    ]

Solution 2.2: add it to a separate tsconfig.eslint.json file Create a file names tsconfig.eslint.json with this content:

// new file: tsconfig.eslint.json

{
    "include": [
        ".eslintrc.js"
    ]
}

and then inject it into eslintrc.js's parserOptions > project (yes, project accepts both a string, and an array of strings) :

// in eslintrc.js ...

  parserOptions: {
    project: [
        resolve(__dirname, './tsconfig.json'),
        resolve(__dirname, './tsconfig.eslint.json'),
    ],
  }

PS. This answer is very similar, I shall give some credit to that.

Answer 3

This is now documented in TypeScript ESLint's doc in I get errors telling me "The file must be included in at least one of the projects provided"

TLDR: see "Additive option" below for the best solution in my opinion.

Here's the relevant doc with added notes. This builds on a previous answer.

This error means that the file that's being linted is not included in any of the tsconfig files you provided us. A lot of the time this happens when users have test files or similar that are not included in their normal tsconfigs.

Depending on what you want to achieve:

• If you do not want to lint the file:
  • Use one of the options ESLint offers to ignore files, like a .eslintignore file, or ignorePatterns config. => See Solution 1 of this answer
• If you do want to lint the file:
  • If you do not want to lint the file with type-aware linting:
    • Use ESLint's overrides configuration to configure the file to not be parsed with type information.
      • A popular setup is to omit the above additions from top-level configuration and only apply them to TypeScript files via an override. => See the additive option below
      • Alternatively, you can add parserOptions: { project: null } to an override for the files you wish to exclude. Note that { project: undefined } will not work. => See the subtractive option below
  • If you do want to lint the file with type-aware linting:
    • Check the include option of each of the tsconfigs that you provide to parserOptions.project - you must ensure that all files match an include glob, or else our tooling will not be able to find it. => See Solution 2.1 of this answer
    • If your file shouldn't be a part of one of your existing tsconfigs (for example, it is a script/tool local to the repo), then consider creating a new tsconfig (we advise calling it tsconfig.eslint.json) in your project root which lists this file in its include. For an example of this, you can check out the configuration we use in this repo: => See Solution 2.2 of this answer or examples below
      • tsconfig.eslint.json
      • .eslintrc.js

Additive option

With this solution, you only add (i.e. enable) the parser: '@typescript-eslint/parser' option (and other related options) for the TypeScript source files. Other files like eslintrc.js won't be affected by that configuration, but will still be linted according to the rest of the configuration.

Add this to eslintrc.js

overrides: [
  {
    files: ['src/**/*.ts'],
    parser: '@typescript-eslint/parser',
    parserOptions: {
      tsconfigRootDir: __dirname,
      project: ['./tsconfig.json'],
    },
    rules: {},
  },
],

The above configuration only uses TypeScript ESLint for files in the src directory.

Note that all TypeScript ESLint rules also need to be in the overrides entry (i.e. not the root rules option) or you'll get error messages like this:

Error: Error while loading rule '@typescript-eslint/dot-notation': You have used a rule which requires parserServices to be generated. You must therefore provide a value for the "parserOptions.project" property for @typescript-eslint/parser.

Subtractive option

With this solution, you remove the parser: '@typescript-eslint/parser' option for the eslintrc.js (or eslint.cjs) configuration file.

Add this to eslintrc.js

overrides: [
  {
    files: ['./.eslintrc.js'],
    parserOptions: { project: null },
    rules: {},
  },
],

The above configuration disables TypeScript ESLint for the eslintrc.js file. You can also add other files or folders in override.files to extend this behavior.

Con: all TypeScript ESLint rules also need be removed in the overrides entry or you'll get error messages like this:

Error: Error while loading rule '@typescript-eslint/dot-notation': You have used a rule which requires parserServices to be generated. You must therefore provide a value for the "parserOptions.project" property for @typescript-eslint/parser.