Parsing Error The Keyword import is Reserved (SublimeLinter-contrib-eslint)

I have a problem with eslint, it gives me [Parsing Error The keyword import is reserve] this is only occur in sublime, in atom editor work well. I have eslint

.eslintrc.js

module.exports = {
    "extends": "airbnb",
    "plugins": [
        "react"
    ]
};

package.json

{
  "name": "paint",
  "version": "0.0.0",
  "description": "paint on the browser",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [
    "paint",
    "javascript"
  ],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "browserify": "^11.2.0",
    "eslint": "^2.2.0",
    "eslint-config-airbnb": "^2.1.1",
    "eslint-plugin-react": "^3.11.2",
    "gulp-babel": "^5.2.1",
    "gulp-clean": "^0.3.1",
    "gulp-stylus": "^2.2.0",
    "vinyl-source-stream": "^1.1.0"
  }
}

Solution 1:

Add this to the root of your .eslintrc

"parser": "babel-eslint"

and make sure to run:

npm i babel-eslint --save-dev

Solution 2:

The eslint option that solves the "The keyword import is reserved" error is parserOptions.sourceType. Setting it to "module" allows the import keyword to be used.

.eslintrc

{
    "parserOptions": {
        "sourceType": "module"
    }
}

Docs: https://eslint.org/docs/user-guide/configuring#specifying-parser-options

Solution 3:

Spent 30 mins - trying all solutions but dint work, so sharing this one.

The issue is seen with new react app, and in Visual Code, even at this time - Apr 2020.

  1. Create a file .eslintrc.js in the root folder (beside package.json, or beside /src/ directory)
  2. Paste below contents in .eslintrc.js
  3. Restart your editor, like VS Code.
  4. Now I can see real errors, instead of those fake import/export errors.

.eslintrc.js file contents:

module.exports = {
  env: {
    commonjs: true,
    node: true,
    browser: true,
    es6: true,
    jest: true,
  },
  extends: ["eslint:recommended", "plugin:react/recommended"],
  globals: {},
  parser: "babel-eslint",
  parserOptions: {
    ecmaFeatures: {
      jsx: true,
    },
    ecmaVersion: 2018,
    sourceType: "module",
  },
  plugins: ["react", "import", "react-hooks"],
  ignorePatterns: ["node_modules/"],
  rules: {},
  settings: {
    react: {
      version: "latest", // "detect" automatically picks the version you have installed.
    },
  },
};

Hope that helps.