Lint Like It’s 2015

It’s ES6 and it lints fine.
It wasn’t bad.
Unlike React’s JSX Harmony mode, Babel supports { [key]: value } JSON syntax, let and const, for-of loops and generators.

An Important Disclaimer

Only do this if you don’t mind a few false flags while the bugs are being fixed. On my 700-something module codebase, I have about 20 invalid flags caused by 4 babel-eslint bugs. I reported them all and fully expect them to be fixed soon! Since I don’t run hinting as a build step, this doesn’t affect my productivity, but you may want to wait out a little bit.

Installing eslint and babel-eslint

Start by creating a file called .eslintrc in the root of your project. It might look like this:

{
// I want to use babel-eslint for parsing!
"parser": "babel-eslint",
"env": {
// I write for browser
"browser": true,
// in CommonJS
"node": true
},
// To give you an idea how to override rule options:
"rules": {
"quotes": [2, "single"],
"eol-last": [0],
"no-mixed-requires": [0],
"no-underscore-dangle": [0]
}
}
npm uninstall -g eslint # uninstall the global if you have itnpm install --save-dev eslint@latest
npm install --save-dev babel-eslint@latest
./node_modules/.bin/eslint -v
  "scripts": {
"lint": "eslint src"
},

Configuring Sublime

If you started reading from this section because you have already set up ESLint before, make sure it’s installed globally and available in PATH. Still better, do read the previous section, it will save you configuration woes.

If You Use React Too…

Make sure you use include some rules from eslint-plugin-react! Some of them help ESLint understand the semantics of React JSX usage, and others are just nice additional static checks specifically for React code.

Links

--

--

Working on @reactjs. Co-author of Redux and Create React App. Building tools for humans.

Love podcasts or audiobooks? Learn on the go with our new app.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Dan Abramov

Dan Abramov

Working on @reactjs. Co-author of Redux and Create React App. Building tools for humans.