eslint "parsing error: Unexpected token {" in JSX
I've got the same error on Next.js.
These steps solved my issue:
1) Install babel-eslint:
npm install --save-dev babel-eslint
2) Add babel-eslint as a parser to eslint config
"parser": "babel-eslint"
My eslint config looks like this (.eslintrc):
{
"env": {
"browser": true,
"es6": true,
"commonjs": true,
"node": true
},
"extends": ["eslint:recommended", "plugin:react/recommended"],
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 9,
"ecmaFeatures": {
"jsx": true
},
"sourceType": "module"
},
"plugins": ["react"],
"rules": {
"react/react-in-jsx-scope": 0,
"no-console": 1
}
}
Eslint on its own is not good enough. First install babel-eslint
:
npm install --save-dev babel-eslint
Or with yarn:
yarn add -D babel-eslint
Then add to your .eslintrc
file:
"parser": "babel-eslint"
You might want to install eslint-plugin-babel
as well, but I believe this is not needed