Skip to main content
  1. Posts/

ESLint config for React + Redux projects

·1 min·

In my ongoing love affair with static code analysis tools, I wanted to find a good code linter for JavaScript, to use with Sublime. More specifically, a ReactJS project, with Mocha for tests, and of course using the awesome ES6 syntax (with Babel).

With a background in Ruby and Go, I’m used to some great tooling like Rubocop/BeautifyRuby/govet/gofmt/golint. There is a tight feedback loop when running a linter (automatically on saving a file). A team discussing+agreeing+following+evolving the same coding style on a project is a good thing, and fun process to be a part of.

Also, if you’re relatively new to a language, code linters can be a great source of learning to avoid common mistakes.

In terms of JavaScript, there are some decent JS linter tools out there, for example;

In the context of my problem, Sublime+ES6+Babel, it came down to JSHint vs ESLint. JSHint was okay, and had decent support via SublimeLinter-jshint. However I was able to get up and running much faster with ESLint, with some help from Mr Redux himself, Dan A.

My current .eslintrc looks like this;

Main style points include;