How to add ESLint to a React Project

This is how I add eslint to a javascript project. It also lints .jsx files.

Run npm install babel babel-eslint eslint eslint-plugin-react

Then set in your .eslintrc file

{
  "parser": "babel-eslint",
  "plugins": [
    "react"
  ]
}

Also enable whatever rules you’d like from eslint-plugin-react.

Add to your .package.json

"scripts": {
  "pretest": "eslint --ext=.js,.jsx ."
}

Now you can lint your project by running npm test. Note, this is an npm package.json convention. Alternatively you could name the task lint then run npm run lint.

Ignore any files from linting by adding .eslintignore file

bundle.js

See also NPM Scripts

If you need help solving your business problems with software read how to hire me.