Cannot find module '@typescript-eslint/parser' when using Prettier Eslint

Question

I'm getting the following error from Prettier Eslint Output on VSCode when saving the file.

Error: Cannot find module '@typescript-eslint/parser'
Require stack:
- c:\Users\vtnor\.vscode\extensions\rvest.vs-code-prettier-eslint-0.4.1\dist\extension.js
- c:\Program Files\Microsoft VS Code\resources\app\out\vs\loader.js
- c:\Program Files\Microsoft VS Code\resources\app\out\bootstrap-amd.js
- c:\Program Files\Microsoft VS Code\resources\app\out\bootstrap-fork.js

My package json is:

[...]
"typescript": "^4.2.2",
"@typescript-eslint/eslint-plugin": "^4.16.1",
"@typescript-eslint/parser": "^4.16.1",
"eslint": "^7.21.0",
"prettier": "^2.2.1",
"prettier-eslint": "^12.0.0",
[...]

shim · Accepted Answer · 2023-10-26 15:36:47Z

17

I actually had this problem the other day; you need to go to your .eslintrc and make sure that the module is there under the parser property of the config. Should look something like this in the end:

{
  //...

  "extends": [
    "eslint:recommended",
    "plugin:@typescript-eslint/eslint-recommended",
    "plugin:@typescript-eslint/recommended",
    "prettier/@typescript-eslint",
    "plugin:prettier/recommended"
  ],
  "parser": "@typescript-eslint/parser",
  "plugins": [
    "@typescript-eslint"
  ],

  //...
}

This should cover the essentials regarding dependencies in your linter. Hope it helps.

Edit

I checked GitHub for this issue, might not be the same as the one I had, check this link please.

edited Oct 26, 2023 at 15:36

shim

10.3k13 gold badges79 silver badges121 bronze badges

answered Mar 2, 2021 at 18:15

bloo

1,5602 gold badges14 silver badges21 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Vítor Norton Over a year ago

I tried to add and remove this parser line. Currently I do have this line and I moved it - just in case - to be after extends. Still got the same error.

Vítor Norton Over a year ago

This isn't the same error, but I did try to restart my PC. Didn't work.

Amiya Panigrahi Over a year ago

not working please let me know if you find any solution @VítorNorton

Bart Over a year ago

Thank you, it worked for me. Make sure that you also restart vscode to see the warning disappear.

Claudio Bertozzi · Accepted Answer · 2021-09-14 08:46:19Z

13

Had this problem also, I resolved disabling, then reloading and re-enabling ESLint extension of VSCode.

Hope this helps ;)

answered Sep 14, 2021 at 8:46

Claudio Bertozzi

6165 silver badges13 bronze badges

Comments

user15717674 · Accepted Answer · 2021-08-09 15:26:43Z

6

I discovered that the cause of the error in my case was ESLint itself was throwing an error. I discovered this by looking at the ESLint output in VSCode. The fix was to update one of my other dependencies (eslint-plugin-import).

answered Aug 9, 2021 at 15:26

user15717674

811 silver badge1 bronze badge

1 Comment

Rangel Stoilov Over a year ago

this should be the best answer! I found out that one of the plugins was not loading since it shouldn't be there and the parser was throwing in the Prettier Eslint output but the real issue was found in the Eslint Output

Deemo Harlos · Accepted Answer · 2022-01-28 13:11:05Z

3

Installing @typescript-eslint/eslint-plugin and then reloading VSCode solved the issue for me.

Hope this helps anyone :D

answered Jan 28, 2022 at 13:11

Deemo Harlos

391 bronze badge

Comments

Manohar Reddy Poreddy · Accepted Answer · 2022-06-21 06:36:03Z

2

Open VS Code in the correct directory.

Example, we have:

/dir1/
/dir1/node_modules

In the dir1 directory
. Right click
. Open with Code

answered Jun 21, 2022 at 6:36

Manohar Reddy Poreddy

28k10 gold badges170 silver badges150 bronze badges

Comments

Jack Miller · Accepted Answer · 2021-05-31 16:27:38Z

1

The problem probably that .eslintrc is not finding necessary modules because that are in a wrong location. .eslintrc needs to have folder node_modules right next to it. This can easily be achieved by putting .eslintrc into the project folder and creating package.json right next to it. Then node_modules will also be created in the project folder and the necessary (and installed) modules will be found.

Your project folder should look similar to:

answered May 31, 2021 at 16:27

Jack Miller

7,7964 gold badges53 silver badges82 bronze badges

Comments

Max Pekarsky · Accepted Answer · 2022-12-21 23:44:54Z

1

Fixed this with npm remove @typescript-eslint/parser && npm install @typescript-eslint/parser

answered Dec 21, 2022 at 23:44

Max Pekarsky

6082 gold badges7 silver badges21 bronze badges

Comments

user25037245 · Accepted Answer · 2024-05-14 11:00:13Z

1

In my case, I was already using eslint-plugin-import and eslint-import-resolver-typescript, but @typescript-eslint/parser was a transitive dependency of typescript-eslint. Therefore, installing @typescript-eslint/parser explicitly, fixed the issue for me.

answered May 14, 2024 at 11:00

user25037245

111 bronze badge

Comments

Fotios Tsakiris · Accepted Answer · 2021-10-15 07:16:39Z

0

I just added the metro.config.js (like I did for an other fix for babel.config.js) to .eslintignore.

answered Oct 15, 2021 at 7:16

Fotios Tsakiris

1,6111 gold badge24 silver badges32 bronze badges

Collectives™ on Stack Overflow

Cannot find module '@typescript-eslint/parser' when using Prettier Eslint

9 Answers 9

4 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

9 Answers 9

4 Comments

Comments

1 Comment

Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related