score:23
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
score: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.
score: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.
score: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 create-react-app@4.0.0 and react-scripts@4.0.0.
protip: if your newly created react app doesn't have a file named app.tsx, then you haven't actually created it correctly.
score: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?
score:3
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/*"
],
score:5
i had the same issue when trying to create a new react app today.
you can try the following steps:
- make sure you update your nodejs to the latest version
- make sure your folder path is short and does not contain spaces
- run:
npm install -g create-react-app
- run:
npm i --save-dev typescript @typescript-eslint/parser
- run:
create-react-app my-app
Source: stackoverflow.com
Related Query
- create react app - without typescript , got Error: Failed to load parser '@typescript-eslint/parser'
- Typescript does not error on compilation with create react app
- Create React App with TypeScript and NPM Link: Enums causing Module parse failed
- React app build failed for popper js typescript error
- Create React App - (ESLint) Failed to load config "shared-config" to extend from. Referenced from: <PATH> in Visual Studio
- React app with typescript I want to integrate SSR in my app But got error
- Invoking servlet through React app using Fetch API - Gives Failed to load Resource error (406 - Not Acceptable)
- Create React App not showing error message with ErrorBoundary
- Trying to deploy my React app with gh-pages but got this error message : The "file" argument must be of type string. Received type undefined
- Create React App not installing, showing an error and aborting installation
- React Native App crashes on android 11 on launch without giving error
- How to solve TypeScript error with axios response in React app
- How to make React Create App Production Error Boundary map to source code
- Custom Proxy in Create React App using Typescript
- How to create a React App without Create-react-app
- How to create react app without git (skipping git)?
- CORS error on httpsCallable firebase in Create React App
- SetupProxy file not being read in Create React App Typescript
- Create React App is throwing "Loading chunk # failed" error
- Getting an out of memory error while using Create React App and Plotly.js
- Error when running jest on a react native + typescript app (Jest encountered an unexpected token)
- Workbox in Create React App without eject
- Can I use Create React App Jest Testing with a test reporter without ejecting?
- CORS error using fetch API - React create app
- Configuring React with Asp.net MVC4,getting error like Failed to load resource[app.jsx] in browser
- JSON Error when create react app
- React app failed to load config "airbnb" in deploying to heroku
- How do I resolve the React app error for npm run build "Failed to compile. Failed to minify the bundle."?
- Failed to load resource: the server responded with a status of 500. Deployed react app with vercel
- create react app react 18 with typescript
More Query from same tag
- Difference and use cases with useEffect and useMemo hooks on React
- Passing props state props using context api
- React JS, using parameters in onClick to change state?
- Argument of type is not assignable to parameter of type 'SetStateAction<never[]>'. in React
- Setting state in React useEffect hook
- Javascript color code variables inside the css file (React JS)
- How to use function parameters/arguments in this.setState
- ReactJS - You may need an appropriate loader to handle this file type
- React Redux connect is not assignable to type '() => void' with typescript
- cant get background image on full screen size in reactjs
- Javascript initialization with React
- Prevent user from go back to the login page when user logged in React js
- Why react-router-dom doesn't provides location.key on first load?
- Re-setting the whole state in setState()
- webpack production build not working
- How to render components from an array on screen only when the corresponding button is clicked?
- How to render a component using a conditional statement in reactjs?
- Reactjs call componentWillMount of parent component
- Typing generator functions in Redux-Saga with Typescript
- React store dispatch throttling
- Zip File Download via Axios from Express Server not working in React App
- props-dependent Switch color in Material-UI
- React Hooks must be called in a React function component when using React RTK query createApi
- Why is passing function argument to React.useState and the return function will return stale value
- Slick slider in react arrow icon get hiding
- React render private route after redux(user authentication) is updated
- Passing in Redux state to React Component
- Fetching a data text from API response and presenting it in a chat with React
- How to toggle checkbox value in React Hooks?
- How to reset input form on submit (ReactJS)