How To Fix “parserOptions.project has been set for @typescript-eslint/parser”

ParserOptions.project has been set for @typescript-eslint/parser

ESLint supports TypeScript with the typescript-eslint parse. However, you may run into the “parserOptions.project has been set for @typescript-eslint/parser” error after setting it up. Read on to learn how to fix the issue.

Cause of the error

When you use ESLint with your TypeScript project, you might come across an error message like this:

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.

To solve this problem, you have to understand how ESLint’s configuration works. This plugin is a great addition to the arsenal of any TypeScript developer. It brings linting to your projects, analyzing your code and finding programming errors in them. For instance, it can find logic errors in a loop when you iterate over a Map in TypeScript.

ESLint requires a configuration file for each project. It is usually named .eslintrc.js (the dot at the beginning of the name indicates that this is a hidden file). ESLint automatically looks for this file in the root folder of your TypeScript project.

This configuration file allows you to enable or disable rules for syntax validation and even customize rules to fit your needs.

A typical .eslintrs.js looks like this:

{
    "root": true,
    "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": { 
    	"project": [
        	"./tsconfig.json"
        ] 
    },
    "plugins": [
        "@typescript-eslint"
    ],
    "rules": {
        "@typescript-eslint/strict-boolean-expressions": [
        	2,
            {
                "allowString" : false,
                "allowNumber" : false
            }
        ]
    },
    "ignorePatterns": [
      	"src/**/*.test.ts", 
      	"src/frontend/generated/*"
    ]
}

This file tells ESLint to use typescript-eslint, our TypeScript parser for ESLint. You can also configure the path to the tsconfig.json file of your project with the parserOptions.project option. You are required to set this option if you want to use rules that need type information.

When the parserOptions.project option is set, ESLint will only show the lint files included in the tsconfig.json file. You must include every file you need to link in that file. Otherwise, the parse will throw the error:

The file does not match your project config: .eslintrc.js.
The file must be included in at least one of the projects provided.

In this case, it means .eslintrc.js, your own ESLint configuration file, exists in the project source but isn’t in tsconfig.json.

To solve this, you must explicitly include it in your projects or ignore it, and ESLint offers many methods for this task.

Solutions for the “parserOptions.project has been set for @typescript-eslint/parser” error

Include the file with tsconfig.eslint.json

Create a file named tsconfig.eslint.json at the root of your project structure as follows:

{
    "extends": "./tsconfig.json",
    "include": [
        "src/**/*.ts",
        "test/**/*.ts",
        "typings/**/*.ts",
        "src/**/*.js"
    ]
}

This configuration file tells ESLint to include some other files in addition to what is included in tsconfig.json. In particular, this example includes every .ts source file in the src, test, and typings folders. Add the final line if you have mixed JavaScript code in your project.

Ignore the file with .eslintignore

The .eslintignore file is one of the methods ESLint officially supports when you don’t want it to lint certain files and folders. Each line in this text file has to be a glob pattern that indicates the path to files or folders you want to omit from linting.

Create the file in the root folder of your project and add this line:

.eslintrc.js

The next time you run npm run lint, ESLint will look for the .eslintignore file before it determines which files to link. The line above prompts it to drop the ESLint configuration file from the linting list.

Summary

The error “parserOptions.project has been set for @typescript-eslint/parser” occurs when ESLint runs into a file not included in your TypeScript project configuration. To resolve this, you will need to either include or exclude it explicitly. I hope this article is helpful for you, thank you for reading!

Maybe you are interested:

Leave a Reply

Your email address will not be published. Required fields are marked *