如何配置ESLint以允许使用胖箭头类方法

您的示例不是有效的ES6，因此无法配置eslint允许它

首次安装babel-eslint：

npm i -D babel-eslint

然后将以下内容添加到您的.eslintrc.json文件中：

"parser": "babel-eslint"

根据我在错误消息中看到的内容，Parsing error: Unexpected token =它看起来像是解析器错误，而不是短绒毛的解析器错误。

假设您将Babel用作JavaScript编译器/编译器和babel-eslintESLint解析器，则很有可能是Babel在抱怨语法而不是ESLint。

问题不在于箭头函数，而是更多的实验性（ES7 ??），我认为它被称为属性初始值设定项或类实例字段（或两者都:)）。

如果要使用此新语法/功能，则需要preset-stage-1在Babel中启用。该预设包括syntax-class-properties允许该语法的插件。

加起来：

1. 安装babel预设：

   npm install babel-preset-stage-1
   

2. 将此预设添加到您的或您的查询字段中的预设列表中（我想您已经在使用es2015和react预设）（如果您正在使用webpack）。.babelrcbabel-loader

   "presets": ["es2015", "stage-1", "react"]
   

首先安装以下插件：

npm i -D babel-eslint eslint-plugin-babel

然后将这些设置添加到您的eslint配置文件中：

.eslintrc.json

{
    "plugins": [ "babel" ],
    "parser": "babel-eslint",
    "rules": {
        "no-invalid-this": 0,
        "babel/no-invalid-this": 1,
    }
}

这样，您可以使用胖箭头类方法，而且您不会no-invalid-this从eslint中得到任何错误。

快乐鳕鱼

我今天遇到了同样的问题

@dreyescat的答案对我有用。

默认情况下，巴贝尔使用3个预设：es2015，react，stage-2

带有“解析错误：意外的令牌=“的屏幕截图

然后，如果您还选择了stage-1预设，则错误消失了

屏幕截图无错误

您可以自己在bebeljs.io网站上对其进行测试

如果要使用实验性功能（例如箭头作为类方法），则需要babel-eslint用作解析器。默认解析器（Espree）不支持实验性功能。