'babel-eslint' was not found. Error: ESLint configuration of processor in '.eslintrc.json#overrides[0]' is invalid

Question

I have a eslint config file .eslintrc.json (could be.eslintrc) like this:

{  
  "env": {
    "browser": true,
    "es6": true
  },
  "extends": [
      "eslint:recommended",
      "plugin:react/recommended",
      "plugin:@typescript-eslint/eslint-recommended",
      "airbnb-typescript-prettier"
  ],
  "plugins": [
    "@typescript-eslint"
  ],
  "globals": {
      "Atomics": "readonly",
      "SharedArrayBuffer": "readonly"
  },
  "parser": "@typescript-eslint/parser",
  "parserOptions": {
      "ecmaFeatures": {
          "jsx": true
      },
      "ecmaVersion": 2018,
      "sourceType": "module"
  },
  "overrides": [
    {
        "files": ["*.js", "*.jsx"],
        "processor": "babel-eslint"
    }
  ],
  "rules": {
    "react/prop-types": 0,
    "semi": ["error", "never"]
  }
}

and I got a persistent error

Error: ESLint configuration of processor in '.eslintrc.json#overrides[0]' is invalid: 'babel-eslint' was not found

Answer 1

Although official eslint site suggest this configuration, you need to use parser property in the overrides instead of processor such as the following:

...
  "overrides": [
  {
    "files": ["*.js", "*.jsx"],
    "parser": "babel-eslint"
  }
],
...

With this change everything works pretty well.