pedro luis
pedro luis

Reputation: 1745

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"
  }
}

Upvotes: 146

Views: 255191

Answers (15)

Daniel Barbakadze
Daniel Barbakadze

Reputation: 211

For me VSCode the eslint extension had a problem and after disabling it for current workspace it worked

Upvotes: 0

Crisoforo Gaspar
Crisoforo Gaspar

Reputation: 3830

The currently highest voted answer works. However, it is no longer under maintenance and the newly suggested approach is to use the version from the mono repo instead.

Installation

$ npm install eslint @babel/core @babel/eslint-parser --save-dev
# or
$ yarn add eslint @babel/core @babel/eslint-parser -D

.eslintrc.js

module.exports = {
  parser: "@babel/eslint-parser",
};

Reference

Upvotes: 11

joaovitorfelix
joaovitorfelix

Reputation: 83

I have been facing this error on next.js 13 today and my eslint file looks like this:

{
  "root": true,
  "settings": {
    "react": {
      "version": "detect"
    },
    "env": {
      "browser": true,
      "node": true,
      "es2020": true,
      "jest": true
    },
    "extends": [
      "eslint:recommended",
      "plugin:react/recommended",
      "plugin:react-hooks/recommended",
      "plugin:@typescript-eslint/recommended",
      "plugin:prettier/recommended"
    ],
    "parser": "@typescript-eslint/parser",
    "parserOptions": {
      "ecmaVersion": "latest",
      "sourceType": "module",
      "ecmaFeatures": {
        "jsx": true
      }
    },
    "plugins": ["react", "react-hooks", "@typescript-eslint"],
    "rules": {}
  }
}

So I removed this piece of code and it works fine:

"settings": {
        "react": {
          "version": "detect"
        }

Upvotes: 1

Apurv
Apurv

Reputation: 123

ESlint the disabling rules in .eslintrc.json file.

  {
  "extends": "next",
  "rules": {
    "react/no-unescaped-entities": "off",
    "@next/next/no-page-custom-font": "off"
  }
}

Upvotes: 1

Bhupinder
Bhupinder

Reputation: 11

I found this issue while creating the vue project (Used Editor: Visual Code)

Install babel-eslint package

npm install babel-eslint

Create the .eslintrc.js file and add below code

module.exports = {
    root: true,
    parserOptions: {
        'sourceType': 'module',
        parser: 'babel-eslint'   
    }
}

npm run serve, that error will be resolved like magic.

Upvotes: 1

Arvind Maurya
Arvind Maurya

Reputation: 31

The issue is seen with the new react app, and in Visual Studio Code, even at this time - August 2022

Create a file .eslintrc.js in the root folder Paste the below contents in .eslintrc.js Restart your editor, like VS Code. Now I can see real errors, instead of those fake import/export errors. .eslintrc.js file contents:

   export const parser = "@babel/eslint-parser";

The accepted answer works, however, the newly suggested approach is to use the version from ES6.

Upvotes: 3

Iman  Mohamadi
Iman Mohamadi

Reputation: 6839

Add this to the root of your .eslintrc.json (formerly .eslintrc)

"parser": "babel-eslint"

and make sure to run:

npm install babel-eslint --save-dev

Upvotes: 259

Gvs Akhil
Gvs Akhil

Reputation: 2634

Adding ecmaVersion to .eslintrc.json fixed the issue

{
    "ecmaVersion": 2015,
    "extends": [
        "eslint:recommended",
        "plugin:react/recommended"
    ]
}

Upvotes: 1

Mohammad Fasha
Mohammad Fasha

Reputation: 478

The same issue occurred when creating js files within a typescript react-native project while eslint is enabled.

Changing the file type from js to ts resolved the issue.

Also, adding the .eslintrc.js file as mentioned in previous answers resolved the issue without changing the file type from js to ts.

       module.exports = {
          parser: "@babel/eslint-parser",
       };

Upvotes: 3

JulienRioux
JulienRioux

Reputation: 3092

Closing VS code and re-open it does the trick for me...

Upvotes: 15

Nitin Jadhav
Nitin Jadhav

Reputation: 7336

This config worked for me. (I am using create-react-app but applicable to any eslint project)


.eslintrc (create file in root if it doesnt exist)

{
    "rules": {
      "jsx-a11y/anchor-is-valid": [ "error", {
        "components": [ "Link" ],
        "specialLink": [ "to" ]
      }]
    },
    "parserOptions": {
        "sourceType": "module",
        "ecmaVersion": 2015
    }
  }

Upvotes: 3

user8202629
user8202629

Reputation:

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

Upvotes: 112

SPM
SPM

Reputation: 31

i also got this error in a meteor project and i could solved it setting sourceType to "module" more details can be found in Eslint docs: http://eslint.org/docs/user-guide/configuring#specifying-parser-options

Upvotes: 3

pedro luis
pedro luis

Reputation: 1745

The problem was i had installed eslint globally and locally, causing inconsistencies in SublimeLinter-contrib-eslint. I uninstalled eslint globally and SublimeLinter is working.

Upvotes: 19

the
the

Reputation: 119

Not sure about it but try to rename your file to .eslintrc and just use

{
  "extends": "airbnb",
  "plugins": ["react"]
};

Also be sure you have the required packages installed. github.com/airbnb/javascript

Upvotes: 9

Related Questions