Javascript: Error: "Configuration for rule "react/jsx-sort-props" is invalid"

[himynameisdave]

Okay so just tried to update some packages, including some eslint-related stuff and __shock-of-shocks__ it broke stuff... So I removed everything (rm -rf /node_modules, cleared out devDependencies in package.json), thinking I'd just re-install everything from scratch using this dumb long-ass command npm i -D eslint eslint-config-airbnb eslint-plugin-import eslint-plugin-react eslint-plugin-jsx-a11y. Still broken (because I assume it tried to install the updated versions)... looks like something in the React package maybe?

Trying to use this as an eslint config is actually stupid though. The number of times I've installed all this shit using the above command, only to have it throw errors is _extremely_ frustrating. It's dependants should just be included and I shouldn't have to install all this extra bullshit just to use it. I understand the thinking behind it (what if not everyone wants the whole kitchen sink right) but clearly wider developer ergonomics were not a priority in designing this. Anyone have an alternative solution/one eslint config file will all the rules in it?

Anyway, for now I guess I'll just revert to whatever versions I was using before and just never update anything because who knows what might break tomorrow ¯__(ツ)__/¯

[himynameisdave]

More details:

Here's my package.json after updating:

"devDependencies": {
    "eslint": "^3.3.1",
    "eslint-config-airbnb": "^10.0.1",
    "eslint-plugin-import": "^1.13.0",
    "eslint-plugin-jsx-a11y": "^2.1.0",
    "eslint-plugin-react": "^6.1.1"
  },

...and my.eslintrc is basically bare:

{
  "extends": "airbnb"
}

[ljharb]

To install the config properly, please make sure to use the command in the readme that automatically installs the right peer dep versions for you (although I think you've got the right ones already).

As far as your complaints about peer deps and descendants, I agree, but that's how eslint works - there is _no way_ to avoid it short of changes in eslint itself.

Typically, these errors arise from editors using the global eslint instead of the local one - but your stack trace implies it's using the local one, so I'm not really sure.

Have you restarted your editor after updating node_modules? Most editors cache things such that npm install while they're still open will break them.

[himynameisdave]

Restarting Atom solved the issue! Will try this next time I'm getting issues, and will maybe even file an issue over there instead!

Thank you sir! 👏

[Chaoste]

Sorry for interrupting this beautiful silence but restarting Atom didn't work out for me. Maybe someone else has the same problem as me and wants to know how I fixed this bug. I just installed the eslint packages globally and the linter worked - for more information see below:

My dependencies in package.json:

"devDependencies": {
  "babel-core": "^6.14.0",
  "babel-eslint": "^6.1.2",
  "eslint": "^3.5.0",
  "eslint-config-airbnb": "^11.1.0",
  "eslint-plugin-import": "^1.15.0",
  "eslint-plugin-jsx-a11y": "^2.2.2",
  "eslint-plugin-react": "^6.2.2",
  "mocha": "^3.0.2"
}

At first i installed eslint and eslint-config-airbnb locally:

├─┬ [email protected] 
│ ├── [email protected] 
│ └── UNMET PEER DEPENDENCY eslint-plugin-import@^1.14.0
├── UNMET PEER DEPENDENCY eslint-plugin-import@^1.14.0
├── UNMET PEER DEPENDENCY eslint-plugin-jsx-a11y@^2.2.1
└── UNMET PEER DEPENDENCY eslint-plugin-react@^6.2.0

After that I fixed the unmet peer dependencies:

npm install eslint-plugin-import eslint-plugin-jsx-a11y eslint-plugin-react

Now I install the linter-eslint plugin (v7.3.1) for Atom (v.1.10.2). If I execute the plugin I get the same error as @himynameisdave. I restarted Atom and reinstalled the packages multiple times but no improvements.

Because the bug didn't disappear I tried installing all eslint packages globally and this finally fixed my problem.

[ljharb]

Perhaps your Atom is set to use the global eslint? You basically want to completely uninstall eslint globally, and configure atom to look at your local one.

[thebarty]

I just had the same problem.

What solved it for me was reading the installation-guide for airbnb at https://github.com/airbnb/javascript/tree/master/packages/eslint-config-airbnb and running a

(
  export PKG=eslint-config-airbnb;
  npm info "$PKG@latest" peerDependencies --json | command sed 's/[\{\},]//g ; s/: /@/g' | xargs npm install --save-dev "$PKG@latest"
)