When using npx create-react-app appname
, the react-scripts
package which is installed includes an eslint dependency with "a minimal set of rules that find common mistakes." I want to use prettier and eslint but I can't find information on which, if any, eslint plugins are also installed as part of CRA or find where the base ESLint config to see what is included. I will extend the base ESLint config if needed but the CRA docs say it is Experimental so I want to avoid it if I can.
EDIT: More detailed information
Without manually installing ESLint as a dependency I get (somewhat expected) missing peer dependency
errors for all of the plugins and config dependencies.
With ESLint installed as a dependency I get a CRA error:
> react-scripts start
There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix locally.
The react-scripts package provided by Create React App requires a dependency:
"eslint": "^6.6.0"
Don't try to install it manually: your package manager does it automatically.
However, a different version of eslint was detected higher up in the tree:
~\client\node_modules\eslint (version: 7.2.0)
Manually installing incompatible versions is known to cause hard-to-debug issues.
Windows location: C:\Users\you\. eslintrc.
Because Create React App comes with ESLint already integrated. They use their own sharable ESLint configuration and this can be found under the eslintConfig object in package.
The “lint” command will run ESLint inside every file in the “src/”, even if your “src/” folder contains multiple directories in it, this regex command will go down recursively on them and run ESLint; If some problems are reported by ESLint which are auto-fixable, then “lint:fix” command will do those auto-fixes.
Install the ESLint packages for TypeScript and Jest support. Note, ESLint is installed with create-react-app, so you don't need to explicitly install it. Then install the packages for Airbnb config.
Package.json in your CRA app contains this
"eslintConfig": {
"extends": "react-app"
},
You should just be able to create a .eslintrc
file and that will get picked up instead.
The config can be found at https://github.com/facebook/create-react-app/tree/master/packages/eslint-config-react-app
It uses these plugins
['import', 'flowtype', 'jsx-a11y', 'react', 'react-hooks']
.
Personally think you would be better off with the Airbnb eslint rules or if you want something more comprehensive checkout eslint-config-auto
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With