Add Linting to Help Enforce Rules when Using React Hooks
In order to use Hooks there are a certain set of rules you need to follow. Thankfully, the React Team has provided an ESLint Plugin that will help enforce these rules when using Hooks.
It's really necessary to eject for configuring ESLint? I always used my own config in CRA using an eslintrc.js file without having to eject
Gonzalo,
Yes, you can add your own local eslintrc file, but it won't be used in the dev server or build system. A local eslintrc file will only apply to your IDE (Code, vim, etc...).
If you want create-react-app to know about your custom rules you need to eject. You can see some of the background here https://github.com/facebook/create-react-app/issues/808#issuecomment-252941815
Great!, thanks
It appears you can now add react-hooks linting rules without ejecting.
Installing react, react-dom, react-scripts, and eslint-plugin-react-hooks all with @next and providing the eslintConfig in the package.json as shown provides the expected behavior.
Robert, version 3.0 of create-react-app just came out https://github.com/facebook/create-react-app/releases/tag/v3.0.0 and it now supports the react hooks ESLint rules out-of-the-box... so ejecting isn't needed anymore. I was waiting for this release before re-recording this lesson. I didn't like having to eject because that is messy and makes upgrading harder. Thanks for watching!
Maybe delete this clip now, no longer relevant.
Michael, yeah... now that it's supported in CRA I plan to redo this video and instead focus on what value the lint rules provide (also including the exhaustive-deps rule). Thanks for the feedback!