Eslint-plugin-react: Error while configuring react/jsx-props-no-spreading

[Solavon]

While setting up my eslint rules, I ran into some issues when configuring jsx-props-no-spreading

Expected:
Allow props spreading when the following rule is set

'react/jsx-props-no-spreading': ['error', {
      html: "ignore",
      custom: "ignore",
      exceptions: [],
    }],

Actual:
Getting the following error

Error: .eslintrc.js:
Configuration for rule "react/jsx-props-no-spreading" is invalid:
Value {"html":"ignore","custom":"ignore","exceptions":[]} should NOT be valid.

Package versions:

"eslint": "^6.2.0",
"eslint-plugin-react": "^7.14.3",

[ljharb]

This is intentional; there's no point in using the rule if you're ignoring everything and have no exceptions: https://github.com/yannickcr/eslint-plugin-react/blob/master/lib/rules/jsx-props-no-spreading.js#L48-L63

If you add an exception, or change one of the ignores to "enforce", it should work.

[Solavon]

I understand that it would be pointless, but unfortunately it's part of the airbnb rules that comes with its extension, in any case, after keeping it for a while I can already see its benefit, thank you!

[ljharb]

The airbnb config doesn’t ignore both kinds of components.

[Solavon]

No, as in, this rule came as part of the airbnb config, and I was trying to turn it off.

[ljharb]

Set it to "off" then :-)

[Solavon]

Thanks for teaching me that :P
But I'm going to keep it on for the time being!

after keeping it for a while I can already see its benefit, thank you!

[MichaelPretorius]

How do u switch it to off?

[MichaelPretorius]

No worries got it, thanks

[sadafk831]

Just for the record:
If you wish to use the rule and wish to ignore instead of setting it off. This is how you should use:
In the rule definition, all the fields are made compulsory and specially exceptions is suppose to have an array of string not empty, so the declaration of rules goes like follow

'react/jsx-props-no-spreading': ['error', {
      html: "ignore",
      custom: "ignore",
      exceptions: [""],
    }],

For setting it off you can use either any of the following

'react/jsx-props-no-spreading': ['off']

'react/jsx-props-no-spreading': 0

[AdamAnSubtractM]

This may seem obvious to most people but wasn't to me, this can be set up in an eslintrc.json or eslintrc.js file or in your package.json file by adding a rules object like so:

"rules": { "react/jsx-props-no-spreading": 0 }

[flaviouk]

"rules": {
      "react/jsx-props-no-spreading": [
        "error",
        {
          "explicitSpread": "enforce",
          "html": "ignore",
          "custom": "ignore",
          "exceptions": []
        }
      ]
    }

Configuration for rule "react/jsx-props-no-spreading" is invalid:
    Value {"explicitSpread":"enforce","html":"ignore","custom":"ignore","exceptions":[]} should NOT be valid.

This doesn't work for some reason.. What am I missing? @ljharb

[ljharb]

the rule does not allow an empty exceptions array: https://github.com/yannickcr/eslint-plugin-react/blob/master/lib/rules/jsx-props-no-spreading.js#L66