20

I have sample installation of react-app and I got the following

Error: Failed to load parser '@typescript-eslint/parser' declared in '.eslintrc » eslint-config-react-app#overrides[0]': Cannot find module 'typescript'

after running

 npm run lint -> eslint .

I don't use typescript in this project. I tried to install it from scratch and got it again. also tried to remove tslint from vscode plugin

2

8 Answers 8

28

You can add this to your .eslintignore file in the root of your project.

node_modules

create-react-app team will release a new version with that fix also

https://github.com/facebook/create-react-app/pull/8376

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

1 Comment

It does look to be the fact that eslint . with the current overrides that handle TypeScript mean that node_modules are also being linted for .ts/.tsx files. This PR was raised to work around it: github.com/facebook/create-react-app/pull/9310 Using: ``` "lint": "eslint --ignore-path .gitignore .", ``` also works, as the default .gitignore ignores node_modules, and means a separate .eslintignore does not have to be maintained.
8

I had the same issue when trying to create a new react app today.

You can try the following steps:

  1. Make sure you update your nodejs to the latest version
  2. Make sure your folder path is short and does not contain spaces
  3. Run: npm install -g create-react-app
  4. Run: npm i --save-dev typescript @typescript-eslint/parser
  5. Run: create-react-app my-app

1 Comment

Had this issue in a craco-extended project. npm i --save-dev typescript @typescript-eslint/parser fixed it for me. Thanks!
5

Create React App adds eslint config to package.json, so you just have to add eslintIgnore with node_modules in package.json. A cleaner alternative to creating a separate file .eslintignore

  // package.json
  // ...
  "eslintConfig": {
    "extends": "react-app"
  },
  "eslintIgnore": [
    "node_modules",
    "build/*"
  ],

Comments

1

Most likely, you have this in your .eslintrc:

extends: react-app

It means the following rule is applied:

files: ['**/*.ts?(x)'], 
parser: '@typescript-eslint/parser', 

Which probably means you have *.ts/*.tsx files in your root folder. But maybe it's the vscode-eslint. Did you try to run yarn lint from the terminal?

Comments

0

Your error message says eslint is looking for typescript because of a setting in the file .eslintrc so try looking in that file for @typescript-eslint/parser and remove it.

Comments

0

I was removing typescript from a project and I got the same error because I had forgotten a typescript definition somewhere under the src folder... deleting the file fixed the issue.

Comments

0

In my case, I deleted the yarn lock as well as the yarn error log file that was created when I ran yarn.dev by mistake instead of npm start

Comments

0

In my case, I wanted typescript, but didn't get it installed. This question still helped me figure out my problem which is described below.

I was watching a YouTube video, React Typescript Tutorial that explained how to get started with typescript and react, and the video said to run:

npx create-react-app cra-ts --typescript

This didn't work (but I didn't know it). As soon as I created a hello.ts file, I got the error the OP describes.

Error: Failed to load parser '@typescript-eslint/parser' declared in 'package.json » eslint-config-react-app#overrides[0]': Cannot find module 'typescript'

The fix was to use the command:

npx create-react-app myappts --template typescript

This used [email protected] and [email protected].

ProTip: If your newly created React App doesn't have a file named App.tsx, then you haven't actually created it correctly.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.