ESLint in class with fat arrow using airbnb rules

Question

The following code located in a class that extends React.Component

  nextState = () => {
    this.setState({
      state : this.state.state + 1
    });
  };

However ESLint with airbnb rules catches this and throws the following error: error Parsing error: Unexpected token =

I would like to keep this syntax as it allows me to avoid binding this in the constructor.

Answer 1

I struggled with this problem for quite a while. I found that this configuration of .eslintrc works for your problem.

{
  "extends": "airbnb",
  "parser": "babel-eslint"
}

It works nicely with Sublime Text 3 with SublimeLinter-contrib-eslint.

Note that you need to npm install -g eslint babel-eslint

put .eslintrc in ~/ for global config, put .eslintrc in app folder to overwrite global config.

also note that: Assignment operation inside class is not part of es6, see this link for discussion

Answer 2

You need to specify Language options. For ref: http://eslint.org/docs/user-guide/configuring#specifying-language-options

You can do this with a single command also inside your .eslintrc file.

{
    "env": {
        "es6": true,
        "node": true
    }
}