microsoft / vscode-eslint

VSCode extension to integrate eslint into VSCode
MIT License
1.74k stars 335 forks source link

"parserOptions.project" has been set for @typescript-eslint/parser with WIERD file path #1537

Closed PapyElGringo closed 1 year ago

PapyElGringo commented 2 years ago

Hello everyone and thanks for your support. I open an issue here because I don't reproduce the issue when using the npx eslint command on my project but vscode does. I get the following issues

Parsing error: "parserOptions.project" has been set for @typescript-eslint/parser.
The file does not match your project config: ../../../../../home/papyelgringo/workspace/material-shell/src/manager/stateManager.ts.
The file must be included in at least one of the projects provided.

Please not the wierd file path used for the check.

eslintrc.js

/* eslint-env node */
module.exports = {
    root: true,
    parser: '@typescript-eslint/parser',
    env: {
        es6: true,
    },
    extends: ['eslint:recommended', 'plugin:prettier/recommended', 'prettier'],
    plugins: ['prettier', '@typescript-eslint'],
    rules: {
        'prettier/prettier': 'error',
        camelcase: [
            'off',
            {
                properties: 'never',
            },
        ],
        /* Allow unused variables starting with underscores */
        'no-unused-vars': 'off',
        '@typescript-eslint/no-unused-vars': [
            'warn',
            {
                varsIgnorePattern: '^_',
                argsIgnorePattern: '^_',
                destructuredArrayIgnorePattern: '^_',
            },
        ],
    },
    overrides: [
        {
            files: ['*.ts', '*.tsx'],

            extends: [
                'plugin:@typescript-eslint/recommended',
                // 'plugin:@typescript-eslint/strict',
                // 'plugin:@typescript-eslint/recommended-requiring-type-checking',
            ],

            parserOptions: {
                project: ['./tsconfig.json'],
                ecmaVersion: 2020,
            },
        },
    ],
    globals: {
        ARGV: false,
        Debugger: false,
        GIRepositoryGType: false,
        imports: false,
        Intl: false,
        logError: false,
        print: false,
        printerr: false,
        window: false,
        global: false,
        _: false,
        C_: false,
        N_: false,
        ngettext: false,
    },
};

tsconfig.json

{
    "version": "1.1.0",
    "compileOnSave": true,
    "compilerOptions": {
        "module": "es2020",
        "target": "es2018",
        "outDir": "./build",
        "forceConsistentCasingInFileNames": true,
        "downlevelIteration": true,
        "lib": ["es2018", "dom"],
        "pretty": true,
        "sourceMap": false,
        "declaration": false,
        "removeComments": true,
        "incremental": true,
        "noImplicitAny": true,
        "noUnusedLocals": false,
        "noUnusedParameters": false,
        "strictNullChecks": true,
        "noFallthroughCasesInSwitch": true,
        "allowJs": true,
        "strict": true,
        "moduleResolution": "node",
        "importHelpers": true,
        "baseUrl": ".",
        "paths": {
            "*": ["@gi-types/*", "*"],
            "ui": ["src/types/ui"],
            "gjs": ["src/types/gjs"]
        },
        "experimentalDecorators": true
    },
    "include": ["src"]
}

I figured out that If I change the "include": ["src"] with "include": ["../../../../../home/papyelgringo/workspace/material-shell/src"] it does fix the issue but it's not a solution. Any idea? Thanks in advance

MariaSolOs commented 2 years ago

Try moving the linting configuration for typescript-eslint outside the overrides. The plugin will by default only apply to .ts and .tsx files, so you don't need to set it there.

So basically remove:

 overrides: [
        {
            files: ['*.ts', '*.tsx'],

            extends: [
                'plugin:@typescript-eslint/recommended',
                // 'plugin:@typescript-eslint/strict',
                // 'plugin:@typescript-eslint/recommended-requiring-type-checking',
            ],

            parserOptions: {
                project: ['./tsconfig.json'],
                ecmaVersion: 2020,
            },
        },
    ],

and instead have this at the root level of your config:

 parser: '@typescript-eslint/parser',
 parserOptions: {
    tsconfigRootDir: __dirname, // You seem to be missing this too
    project: ['./tsconfig.json'],
 },
 plugins: ['@typescript-eslint'],
 extends: [
    'eslint:recommended',
    'plugin:@typescript-eslint/recommended',
    'plugin:prettier/recommended', 
    'prettier'
 ],
 env: {
    es6: true,
 }
PapyElGringo commented 2 years ago

Unfortunately it's doesn't change the result and it's now integrate the .eslintrc.js image

rchl commented 2 years ago

Try removing parser: '@typescript-eslint/parser' from the root config. You don't want to use typescript parser for non-ts files.

An alternative (but worse) option would be to add ./.eslintrc.js to include in tsconfig.json.

MariaSolOs commented 2 years ago

Try removing parser: '@typescript-eslint/parser' from the root config. You don't want to use typescript parser for non-ts files.

An alternative (but worse) option would be to add ./.eslintrc.js to include in tsconfig.json.

I'm pretty sure the parser would just ignore non-TS files. In fact, even the TypeScript ESLint docs have an example .eslintrc where the parser is at the root. And yes you can just add the .eslintrc file to the tsconfig and possibly also exclude it from linting.

dbaeumer commented 2 years ago

@PapyElGringo can you provide us with a repository we can clone that demos this with steps to reproduce. This would be the fastest way to understand what is going on.

PapyElGringo commented 2 years ago

Sure but first let me give you more information:

The repo is the following https://github.com/material-shell/material-shell

Current version of vscode

Version: 1.72.2
Commit: d045a5eda657f4d7b676dedbfa7aab8207f8a075
Date: 2022-10-12T22:16:26.920Z
Electron: 19.0.17
Chromium: 102.0.5005.167
Node.js: 16.14.2
V8: 10.2.154.15-electron.0
OS: Linux x64 5.19.13-300.fc37.x86_64
Sandboxed: No
dbaeumer commented 2 years ago

Can you also provide steps on how to reproduce: e.g. which file to open?

PapyElGringo commented 2 years ago

For me it happen for any file under ./src/ so for exemple src/layout/main.ts the result is the following image

dbaeumer commented 2 years ago

Actually, this works for me without problems:

image
dbaeumer commented 2 years ago

Any additinal steps?

PapyElGringo commented 2 years ago

Well I know that the issue is not reproductible for everyone as it worked fine for me also previously or for others contributors but I don't know what changed on my side

dbaeumer commented 2 years ago

Very hard to say why it is not working for you. I would guess that in one of the parent directories you added an Eslint configuration file which is now taken into consideration. Or some different lookup path for node modules. Have you tried to add the root property to your eslint config file to stop the parent lookup chain?

aim-leo commented 1 year ago

I had the same problem, but the problem was solved when I added the following in vscode's setting.json:

"eslint.options": {
    "overrideConfig": {
      "parserOptions": {
        "project": ["/home/my-app-ts/tsconfig.json"]
      }
    }
  }

Yes, I had to additionally specify the location of tsconfig in the vscode plugin, it seems that vscode-eslint is not reading my .eslintrc, even though I have specified tsconfig.json in this file, my .eslintrc file:

{
  "root": true,
  "extends": [
    "react-app",
    "react-app/jest",
    "eslint:recommended",
    "plugin:@typescript-eslint/recommended"
  ],
  "parser": "@typescript-eslint/parser",
  "plugins": ["@typescript-eslint"],
  "overrides": [
    {
      "files": ["**/*.ts", "**/*.tsx"],
      "extends": [
        "plugin:@typescript-eslint/recommended-requiring-type-checking"
      ],
      "parserOptions": {
        "project": "./tsconfig.json"
      }
    }
  ]
}

By the way, the above solution can't completely solve my problem, because eslint will now apply the ts check to the js file. It seems that I also need to additionally explain in setting.json that this configuration is only valid for ts, which feels very cumbersome.

Also, I asked the same question on stackoverflow, my project was created by create-react-app, for testing, I removed all vscode settings to make sure it wasn't my environment configuration issue.

dbaeumer commented 1 year ago

I will close the issue since I was not able to reproduce the original problem.

Please ping if additional information is available.

mac-hel commented 1 year ago

I could reproduce the same issue @aim-leo has When you create symlink to your project directory and then open this symlink in VS Code it does not recognize tsconfigRootDir properly and throws 'Parsing error: "parserOptions.project" has been ....' error.

Basically if you open the project on oryginal directory all is ok, when you open it on symlink VS Code (or maybe rather eslint extension) is lost and you get that error

JoshuaKGoldberg commented 9 months ago

symlink

Note that we have a known issue around symlinks in typescript-eslint: https://github.com/typescript-eslint/typescript-eslint/issues/2987.

ruimarcosjoao commented 5 months ago

Hi, To solve this problem, just add "*/.json" to the includes array in the tsconfig.json file at the root of your project

js "include": [ "/*.ts", "*/.tsx", ".expo/types//*.ts", "expo-env.d.ts", "metro.config.js", "tailwind.config.js", "babel.config.js", "index.js", "*/.json" ]