Turn off ESLint rule (in React app, using WebStorm)

Question

I am writing a React app in WebStorm using the standard React setup. I have never previously explicitly set up any linting, so whatever error/warning messages are showing up are from some sort of default configuration. When I run npm start I get the following warning:

Compiled with warnings.

Warning in ./path/to/MyComponent.js

/my/complete/path/to/MyComponent.js
  19:49  warning  Unexpected whitespace before property bind  no-whitespace-before-property
...
You may use special comments to disable some warnings.
Use // eslint-disable-next-line to ignore the next line.
Use /* eslint-disable */ to ignore all warnings in a file.

The last two lines make it explicitly clear that the warnings are from ESLint (as opposed to, say, JSHint or some custom React linting, etc.).

I want to keep ESLint running, i.e. I don't just want to globally disable all linting. However, I want to turn the "no-whitespace-before-property" warning off everywhere, not just on one line or in one file. How do I do that?

My package.json shows the following for npm start (which is what I run when the warnings appear):

"scripts": {
  "start": "react-scripts start",
  ...
}

I am developing in WebStorm. The ESLint preferences panel has the "Enable" checkbox unchecked, so all of the ESLint configuration options in the IDE are grayed-out and presumably irrelevant, so presumably also the configuration and invocation of ESLint are happening elsewhere (e.g. built into React?).

I tried putting the following .eslintrc.json file into my project home directory:

{
  "rules": {
    "no-whitespace-before-property": "off"
  }
}

alone as well as with "extends": "eslint:recommended".

I tried adding the following to my project's package.json file:

{
  ...
  "eslintConfig": {
    "rules": {
      "no-whitespace-before-property": "off"
    }
  }
}

I've also tried setting the value to 0 instead of to "off".

It may or may not be relevant that I'm writing a React app, and it may or may not be relevant that I'm developing in WebStorm, but I include those facts just in case.

I've checked around on StackOverflow and can't find an answer.

Answer 1

The note below the errors is not coming from ESLint (error is). So I'm assuming you are using some sort of wrapper, like github.com/facebookincubator/create-react-app Those wrappers do not use .eslintrc file and can't be configured directly. You will have to read through documentation of your wrapper to figure out how to disable this rule.

In general ESLint wrappers like create-react-app, standard, xo, etc. are specifically designed to "just work", and hence remove ability to configure and fine tune styles/rules.