React tutorial fails with ESLint error: failed to load babel-eslint parser

[victorlin]

I just followed the tutorial, and it failed on Unit 4/5: Create an Azure Static Web App. The failure is visible on the automatically generated workflow run here.

It can also be reproduced locally:

1. Clone this repo
2. cd react-app
3. npm install
4. npm run build
5. Observe error:

> [email protected] build
> react-scripts build

Creating an optimized production build...
Failed to compile.

[eslint] Failed to load parser 'react-scripts/node_modules/babel-eslint' declared in '.eslintrc.json': Cannot find module 'react-scripts/node_modules/babel-eslint'
Require stack:
- /Users/victor/repos/victorlin/my-static-web-app/react-app/.eslintrc.json

[sneha774]

2 more issues with react tutorial as of now-
Module not found: Error: Can't resolve 'react-router' in 'C:\Snehal\static-webapp-and-api\static-web-app\react-app\src'
ERROR in ./src/App.js 12:0-42
Module not found: Error: Can't resolve 'react-router' in 'C:\Snehal\static-webapp-and-api\static-web-app\react-app\src'

ERROR in ./src/products/ProductList.js 5:0-42
Module not found: Error: Can't resolve 'react-router' in 'C:\Snehal\static-webapp-and-api\static-web-app\react-app\src\products'

Can be fixed by importing 'withRouter' from 'react-router-dom' instead of 'react-router'

[omgLois]

I installed eslint in the root of the application folder (src) by using npm install eslint and then I removed the following from the package.json

"eslintConfig": {
    "extends": "react-app"
  },

then reran npm install followed by npm run build

this has solved the issue for me.