ESlint failing to start due to React dependency?

[memilanuk]

I've done the walk-thru multiple times (including the part where I have to uninstall everything and start over again.

ESlint isn't doing anything to re-format malformed lines as shown in the video. When I click on the 'ESlint' icon in the toolbar (which has to be enabled separately now, apparently) I get the lines shown below:

[Info  - 12:14:59 AM] ESLint server running in node v12.8.1
[Info  - 12:14:59 AM] ESLint server is running.
[Info  - 12:17:16 AM] ESLint library loaded from: C:\Users\memil\Downloads\Beginner Javascript\course files\node_modules\eslint\lib\api.js
Warning: React version was set to "detect" in eslint-plugin-react settings, but the "react" package is not installed. Assuming latest React version for linting.
[Info  - 12:17:18 AM] Error while loading rule 'react/jsx-no-bind': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\some-FINISHED.js
[Info  - 12:21:19 AM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\some-FINISHED.js
[Info  - 12:21:40 AM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\some-FINISHED.js

After running npm install react, I get a success message, but a number of other warnings about peerdeps (sorry, didn't capture those).

Anway, after installing react, which is an odd dependency since the Beginner Javascript course doesn't - as far as I can tell - use react or even touch on it, now I have ESlint about half-way working like shown in the video (#5).

[Asjas]

@memilanuk This eslint config tries to detect React because the config includes React, JavaScript and HTML formatting in one. It's not specific to only the Beginner JavaScript course 🙂

[memilanuk]

@Asjas I figured as much. But I think the argument could be made that for a "No-Sweat" setup that is specifically called out in the Beginner course, to have it depend on React - and then not even mention that - might be a bit of an oversight.

[Asjas]

React doesn't have to be installed - Eslint will try to detect it and will move on if it can't detect it. 🙂

[Asjas]

Doing a bit of testing on Windows 10 it seems that the version "eslint-plugin-react": "^7.14.2" is causing the issue where it completely stops eslint if react isn't installed. Updating the eslint-plugin-react package to 7.20.6 fixes the issue and it runs eslint even if react isn't installed in a project.

I'll open a PR to update the eslint-plugin-react package to the latest version 🙂

[memilanuk]

So... is this supposed to be fixed now?

I went through and cleared everything out, and re-installed... and still getting react dependency errors:

[Info  - 4:21:50 PM] ESLint server running in node v12.8.1
[Info  - 4:21:50 PM] ESLint server is running.
[Info  - 4:21:52 PM] ESLint library loaded from: C:\Users\memil\Downloads\Beginner Javascript\course files\node_modules\eslint\lib\api.js
Warning: React version was set to "detect" in eslint-plugin-react settings, but the "react" package is not installed. Assuming latest React version for linting.
[Info  - 4:21:54 PM] Error while loading rule 'react/jsx-no-bind': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js
[Info  - 4:21:54 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types-FINISHED.js
[Info  - 4:22:03 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js
[Info  - 4:22:19 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js
[Info  - 4:22:21 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js
[Info  - 4:22:25 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js
[Info  - 4:22:27 PM] Error while loading rule 'react/display-name': Cannot find module 'react' from 'C:\Users\memil\Downloads\Beginner Javascript\course files' Occurred while linting C:\Users\memil\Downloads\Beginner Javascript\course files\playground\types.js

It looks like something is still wonky (technical term) in the install process, as a bunch of dependencies don't appear to be met:

PS C:\Users\memil\Downloads\Beginner Javascript\course files> npx install-peerdeps --dev eslint-config-wesbos
install-peerdeps v2.0.3
Installing peerdeps for eslint-config-wesbos@latest.
npm install eslint-config-wesbos@0.0.22 babel-eslint@^9.0.0 eslint@^6.1.0 eslint-config-airbnb@^18.0.0 eslint-config-prettier@^4.1.0 eslint-plugin-html@^6.0.3 eslint-plugin-import@^2.18.0 eslint-plugin-jsx-a11y@^6.2.3 eslint-plugin-prettier@^3.0.1 eslint-plugin-react@^7.14.2 eslint-plugin-react-hooks@^1.4.0 prettier@^1.16.4 --save-dev --registry https://registry.npmjs.org

npm WARN eslint-config-airbnb@18.0.0 requires a peer of eslint-plugin-import@^2.18.2 but none is installed. You must install peer dependencies yourself.
npm WARN eslint-config-airbnb@18.0.0 requires a peer of eslint-plugin-react@^7.14.3 but none is installed. You must install peer 
dependencies yourself.
npm WARN eslint-config-airbnb@18.0.0 requires a peer of eslint-plugin-react-hooks@^1.7.0 but none is installed. You must install 
peer dependencies yourself.
npm WARN eslint-plugin-react-hooks@1.4.0 requires a peer of eslint@^3.0.0 || ^4.0.0 || ^5.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN eslint-config-airbnb-base@14.2.0 requires a peer of eslint@^5.16.0 || ^6.8.0 || ^7.2.0 but none is installed. You must install peer dependencies yourself.
npm WARN eslint-config-airbnb-base@14.2.0 requires a peer of eslint-plugin-import@^2.21.2 but none is installed. You must install peer dependencies yourself.
npm WARN course-files@1.0.0 No repository field.

+ eslint@6.1.0
+ eslint-plugin-html@6.0.3
+ eslint-config-wesbos@0.0.22
+ eslint-config-prettier@4.1.0
+ eslint-config-airbnb@18.0.0
+ eslint-plugin-react-hooks@1.4.0
+ prettier@1.16.4
+ eslint-plugin-jsx-a11y@6.2.3
+ eslint-plugin-import@2.18.0
+ eslint-plugin-prettier@3.0.1
+ eslint-plugin-react@7.14.2
+ babel-eslint@9.0.0
updated 12 packages and audited 226 packages in 12.682s
found 0 vulnerabilities

SUCCESS eslint-config-wesbos
  and its peerDeps were installed successfully.

[Asjas]

@wesbos merged the pull request yesterday but I see he hasn't cut a new release yet, it's still on 0.0.22 on npm. 🙂

You can change eslint-plugin-react to 7.20.6 in the package.json file and then re-run the installation with npm i if you want to continue so long until Wes releases a new version of this config.

[Asjas]

@memilanuk Wes just released version 0.0.23 - I tested it on Windows 10 and it's now installing the updated packages. And I see that eslint now works as well 🙂