Fel med min ".eslintrc.js"-fil - "Parsing error: "parserOptions.project" har ställts in för @typescript-eslint/parser."

Det verkar som att ESLint inte kan tolka en ".eslintrc.js"-fil.

Steg för att återskapa: Jag satte upp ett nytt "hello world" TypeScript-projekt enligt följande:

Make a new directory for our new project
mkdir test
Go into the new directory
cd test
Create a "package.json" file
npm init --yes
Install TypeScript
npm install typescript --save-dev
Install ESLint (the linter)
npm install eslint --save-dev
Install the Airbnb ESLint config (the most popular linting config in the world)
npm install eslint-config-airbnb-typescript --save-dev
The import plugin for ESLint is needed for the Airbnb config to work properly with TypeScript
npm install eslint-plugin-import@^2.22.0 --save-dev
The TypeScript plugin for ESLint is needed for the Airbnb config to work properly with TypeScript
npm install @typescript-eslint/eslint-plugin@^4.2.0 --save-dev
Create the config file for TypeScript
touch tsconfig.json
Create the config file for ESLint
touch .eslintrc.js
Create the entry point for our TypeScript application
touch main.ts

Jag fyller i filen "tsconfig.json" med följande (en tom/standardkonfiguration):

{}

Jag fyller ".eslintrc.js"-filen med följande, som specificerat i Airbnbs dokumentation:

module.exports = {
  extends: ['airbnb-typescript/base'],
  parserOptions: {
    project: './tsconfig.json',
  },
};

Jag fyller i "main.ts" med följande:

const foo = 'bar';

Sedan, när jag kör npx eslint main.ts, genererar det korrekt följande fel:

  1:7  error  'foo' is assigned a value but never used  @typescript-eslint/no-unused-vars

Således verkar ESLint fungera korrekt. Men när jag kör npx eslint .eslintrc.js får jag följande fel:

  0:0  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

Detta fel visas också i VSCode varje gång jag öppnar filen ".eslintrc.js". Felet måste lösas så att ESLint kan linta resten av filen. (För att förtydliga, jag vill att filen ".eslintrc.js" ska lintas på samma sätt som jag vill att min TypeScript-källkod ska lintas - t.ex. ha 2 mellans indragning och så vidare.)

Ytterligare information: Jag använder Windows 10 LTSC med Node v14.8.0 och npm version 6.14.7.

Svar #1

När du använder typercript-drivna eslint-regler (när din eslint-konfiguration inkluderar en "parserOptions.project"-konfiguration), kastar eslint ett fel om du försöker lint en fil som inte är en av de filer som ingår i typescript-projektet.

Detta beror på prestandaskäl - det brukade vara så att eslint tillät detta, men att göra det skulle orsaka en stor prestandapåverkan, så de ändrade det till att i stället ge ett fel.

Lösningen för att linting-filer som inte är en del av ditt TS-projekt är att skapa en tsconfig som utökar din "riktiga" tsconfig, men inkluderar alla filer du vill lint. Detta kallas vanligtvis tsconfig.eslint.json och ser ut så här:

// Special typescript project file, used by eslint only.
{
    "extends": "./tsconfig.json",
    "include": [
        // repeated from base config's "include" setting
        "src",
        "tests",

        // these are the eslint-only inclusions
        ".eslintrc.js",
    ]
}

Och i din .eslintrc.js kommer du att ändra project: ' ./tsconfig.json' till project: './tsconfig.eslint.json'.

Detta bör åtgärda felet och tillåta att .eslintrc.js-filen lintas.

Svar #2

Retsams svar fungerar helt utmärkt. Du kan dock också bara använda @typescript-eslint/parser för TypeScript-filer genom att använda ESLints overrides. Detta undviker att behöva skapa en ny tsconfig.json enbart för ESLint.

module.exports = {
  // Common configuration for .eslintrc.js and TypeScript files
  rules: {
    eqeqeq: "error",
    "no-var": "error",
    // ...
  },
  overrides: [{
    files: "**/*.ts"
    // TypeScript-only configuration
    parser: "@typescript-eslint/parser",
    parserOptions: {
      project: "tsconfig.json",
      tsconfigRootDir: __dirname,
      sourceType: "module",
    },
    plugins: ["@typescript-eslint"],
    rules: {
      "@typescript-eslint/no-floating-promises": "error",
      // ...
    }
  ]},
}

Relaterade artiklar