下面的代码:
import React from 'react';
import { Link } from 'react-router';
import { View, NavBar } from 'amazeui-touch';
import * as Pages from '../components';
const { Home, ...Components } = Pages;
我得到这个eslint错误:
7:16 error Parsing error: Unexpected token .. Why?
这是我的eslint配置:
{
"extends": "airbnb",
"rules": {
/* JSX */
"react/prop-types": [1, {
"ignore": ["className", "children", "location", "params", "location*"]
}],
"no-param-reassign": [0, {
"props": false
}],
"prefer-rest-params": 1,
"arrow-body-style": 0,
"prefer-template": 0,
"react/prefer-stateless-function": 1,
"react/jsx-no-bind": [0, {
"ignoreRefs": false,
"allowArrowFunctions": false,
"allowBind": true
}],
}
}
....
....
有什么问题吗?
由于您的开发环境和ESLint当前的解析能力与正在进行的JavaScripts ES6~7的变化不兼容,在ESLint解析中出现意外的令牌错误。
在.eslintrc中添加"parserOptions"属性对于特定的情况已经不够了,比如使用
static contextTypes = { ... } /* react */
在ES6类中,因为ESLint目前无法自己解析它。这种特殊的情况会抛出一个错误:
error Parsing error: Unexpected token =
解决方案是让ESLint通过兼容的解析器来解析,即@babel/ ESLint -parser或babel- ESLint用于v7以下的babel版本。
添加:
"parser": "@babel/eslint-parser"
在你的.eslintrc文件中运行npm install @babel/eslint-parser——save-dev或者yarn add -D @babel/eslint-parser。
请注意,从React ^16.3开始的新的Context API有一些重要的变化,请参考官方指南。
"parser": "babel-eslint"帮我解决了这个问题
{
"parser": "babel-eslint",
"parserOptions": {
"ecmaVersion": 6,
"sourceType": "module",
"ecmaFeatures": {
"jsx": true,
"modules": true,
"experimentalObjectRestSpread": true
}
},
"plugins": [
"react"
],
"extends": ["eslint:recommended", "plugin:react/recommended"],
"rules": {
"comma-dangle": 0,
"react/jsx-uses-vars": 1,
"react/display-name": 1,
"no-unused-vars": "warn",
"no-console": 1,
"no-unexpected-multiline": "warn"
},
"settings": {
"react": {
"pragma": "React",
"version": "15.6.1"
}
}
}
参考