Setting up ESLint and EditorConfig in React Native projects

I had a hard time going from 4 spaces to 2 spaces indentation, now I’m quite comfortable with it, and I’m happy that airbnb agrees with me

It’s good to have a common coding convention in project. React Native and React is just Javascript project, so let’s use the most popular linter ESLint to help us.

ESLint is an open source project originally created by Nicholas C. Zakas in June 2013. Its goal is to provide a pluggable linting utility for JavaScript.

In Javascript, there are usually 1000 libraries for a problem, a quick search for ESLint in React Native shows something like eslint-plugin-react-native. But like many things in you-dont-need, we need to research a bit before using another frameworks. Most of the time we don’t need that many dependencies, and the less dependencies we have, the better.

How to set up ESLint

For a project set up with react-native init, ESLint is not bootstrapped by default. But it’s extremely easy to setup. Just run

npm install --save-dev eslint babel-eslint