Как настроить ESLint для использования методов класса стрелок класса

ESLint бросает ошибку Parsing error: Unexpected token =, когда я пытаюсь нащупать классы Es6. Какой параметр конфигурации я пропустил, чтобы включить методы класса класса стрелок в eslint?

Пример класса:

class App extends React.Component{
    ...
    handleClick = (evt) => {
        ...
    }
}

.eslint

{
  "ecmaFeatures": {
    "jsx": true,
    "modules":true,
    "arrowFunctions":true,
    "classes":true,
    "spread":true,

  },
  "env": {
    "browser": true,
    "node": true,
    "es6": true
  },
  "rules": {
    "strict": 0,
    "no-underscore-dangle": 0,
    "quotes": [
      2,
      "single"
    ],
  }
}

Ответ 1

Если вы хотите использовать экспериментальные функции (такие как стрелки как методы класса), вы должны использовать babel-eslint в качестве синтаксического анализатора. Параметр по умолчанию (Espree) не поддерживает экспериментальные функции.

Ответ 2

Из того, что я прочитал в сообщении об ошибке Parsing error: Unexpected token =, он выглядит больше, чем ошибка парсера, чем linter one.

Предполагая, что вы используете Babel в качестве вашего компилятора/транспилятора JavaScript и babel-eslint как ваш парсер ESLint, есть вероятность, что Бабель жалуется на синтаксис, а не на ESLint.

Вопрос не о функциях стрелок, а о чем-то более экспериментальном (ES7??), который, я думаю, называется инициализатор свойств или поле экземпляра класса (или оба:)).

Если вы хотите использовать этот новый синтаксис/функцию, вам нужно включить preset-stage-1 в Babel. Этот пресет включает плагин syntax-class-properties, который позволяет использовать этот синтаксис.

Подведение итогов:

Установите предустановку Babel:
```
npm install babel-preset-stage-1
```
Добавьте этот пресет в список ваших пресетов (я полагаю, вы уже используете пресеты es2015 и react), либо в .babelrc, либо в babel-loader поле запроса, если вы используете webpack.
```
"presets": ["es2015", "stage-1", "react"]
```

Ответ 3

Сегодня я столкнулся с той же проблемой.

Ответ на

и @dreyescat работает для меня.

По умолчанию, babel использует 3 пресета: es2015, react, stage-2

Снимок экрана с "Ошибка анализа: Неожиданный токен ="

Затем, если вы также выберите пресет stage-1, ошибка исчезнет

Снимок экрана без ошибок

Вы можете протестировать его на сайте bebeljs.io самостоятельно

Ответ 4

Ваш образец недействителен ES6, поэтому нет возможности настроить eslint, чтобы разрешить его

Ответ 5

handleClick - это метод класса, поэтому нет =:

class App extends React.Component{
  ...
  handleClick(evt) {
    ...
  }
}

если он статический, вы можете сделать:

class App extends React.Component{
  static handleClick = (event) => { }
}

и для привязки читать this или используйте автозавершение декоратора