How do I fix this error message "Initialization error (Eslint). Unexpected Identifier"?

Question

I have Eslint and JSCS setup to reformat some code base with airbnb js style guide in WebStorm. I have been using this setup effectively for the past 2 days, but all of a sudden, WebStorm started throwing this error...

Problem with ESLint reformatting:index.js: Initialization error (ESLint). Unexpected identifier

I thought maybe I had some error in my .eslintrc but then I had used the same config to successfully refactor about 150 files before this sudden error. Prior to this, the JSCS compiler was occasionally throwing "less than a minute timeout" exceptions, but then I would fix this with closing and reopening the file. The eslint though seems not to be falling for this trick.

This is my .eslintrc config

{
  "extends": "airbnb",
  "env": {
    "browser": true,
    "node": true
  },
  "globals": {
    "document": false
  },
  "rules": {
    "validateIndentation": 4,
    "func-names": [
      "error",
      "never"
    ],
    "react/jsx-filename-extension": [
      1,
      {
        "extensions": [
          ".js",
          ".jsx"
        ]
      }
    ],
    "jsx-a11y/label-has-for": [
      2,
      {
        "components": [
          "Label"
        ],
        "required": {
          "some": [
            "nesting",
            "id"
          ]
        },
        "allowChildren": false
      }
    ],
    "jsx-a11y/anchor-is-valid": [
      "error",
      {
        "components": [
          "Link"
        ],
        "specialLink": [
          "to",
          "hrefLeft",
          "hrefRight"
        ],
        "aspects": [
          "noHref",
          "invalidHref",
          "preferButton"
        ]
      }
    ]
  }
}

Some part of package.json

{
    "eslint": "^4.14.0",
    "eslint-config-airbnb": "^16.1.0",
    "eslint-loader": "^1.9.0",
    "eslint-plugin-flowtype": "^2.40.1",
    "eslint-plugin-import": "^2.8.0",
    "eslint-plugin-jsx-a11y": "^6.0.3",
    "eslint-plugin-react": "^7.5.1",
    "extract-text-webpack-plugin": "^3.0.2",
    "prop-types": "^15.6.0",
    "react": "^16.2.0",
    "react-dev-utils": "^4.2.1",
    "react-dom": "^16.2.0",
    "react-redux": "^5.0.6",
    "react-router-dom": "^4.2.2",
  },
  "babel": {
    "presets": [
      "react-app",
      "flow"
    ]
  },
  "eslintConfig": {
    "extends": "react-app"
  }
}

Can some one throw me some pointers on how I can go about fixing this. I suspect it might be more of a WebStorm error than Eslint.

PS: Forgive me if this question might be better suited at superuser. I just thought it's most likely someone here might have faced the same issue.

Answer 1

i use this pattern for my eslint configuraion in phpstorm and error has gone now,

{**/*,*}.{js,ts,jsx,tsx,html,vue},{!node_modules/*}

Answer 2

Solved by a yarn upgrade

---

My attempts at recreating the issue with a fresh project failed, with the same configs, both eslint and jscs were running successfully.

However on using the WebStorm context menu command Apply ESlint Code Style Rules on non js files(tested on .eslintrc itself), i got a much more detailed error.

Error on attempt to find parent and base ESLint configuration files of '.eslintrc': [projectpath]\node_modules\lodash\lodash.js:386 '\u0149': ''n', '\u017f': 's',

I double checked lodash package node_modules and package.json, tripple checked the settings configs(Eslint & JSCS) and was sure I had identical setup to the test projects that were linting without errors.

Running yarn upgrade lodash saved my hair. Since I was already running the latest lodash, I think yarn's Resolving and Rebuilding the packages did the trick.

Hope someone might find this helpful somewhere along the line.