How do I configure ESLint to allow fat arrow class methods How do I configure ESLint to allow fat arrow class methods reactjs reactjs

How do I configure ESLint to allow fat arrow class methods


If you want to use experimental features (such as arrows as class methods) you need to use babel-eslint as a parser. Default parser (Espree) doesn't support experimental features.


First install babel-eslint:

npm i -D babel-eslint

Then add the following to your .eslintrc.json file:

"parser": "babel-eslint"


First install these plugins:

npm i -D babel-eslint eslint-plugin-babel

Then add these settings to your eslint config file:

.eslintrc.json

{    "plugins": [ "babel" ],    "parser": "babel-eslint",    "rules": {        "no-invalid-this": 0,        "babel/no-invalid-this": 1,    }}

This way you can use fat arrow class methods plus you will not get any no-invalid-this errors from eslint.

Happy codin'