Как настроить ESLint для работы с PhpStorm для автоматической проверки ошибок ESLint

Я установил некоторые правила в файле конфигурации ESLint. Этот файл прикреплен в

Preferences
  ->Languages and Frameworks
     ->JavaScript
       ->Code Quality Tools
         ->ESLint

И я вижу, что это работает нормально, потому что в редакторе кода каждое правило отображается, когда появляется ошибка, которая не соответствует им. Также, когда я использую "Инспектор кода" 

Code
  -> Inspect code

Инспектор находит все ошибки и показывает их в маленьком окне внизу. Существует также возможность применять autofix для каждой из этих ошибок, но когда я пытаюсь это сделать, я перенаправлен на страницу конфигурации ESLint в разделе настроек PhpStorm. Это выглядит так:

введите описание изображения здесь

должна быть ссылка, которая должна исправлять это автоматически, когда я нажимаю на нее, но вместо этого есть ссылка, которая просто открывает всплывающее окно конфигурации ESLint:

введите описание изображения здесь

Как я могу заставить это работать нормально? Я пытался посмотреть в документах PhpStorm об этом, но не успел.

Ответы

Ответ 1

Я не нашел способ сделать это в любой IDE (PhpStorm/Atom/Sublime/WebStorm). Однако вы можете исправить некоторые проблемы с помощью командной строки, запустив eslint --fix.

Вам необходимо базовое понимание ESLint, чтобы выполнить следующие действия:

1) Установите ESlint:

Во всем мире:

npm i -g eslint eslint-config-airbnb

(руководство по стилю Airbnb широко используется - http://nerds.airbnb.com/our-javascript-style-guide/.)

ИЛИ локально (предпочтительно):

Установка локально предпочтительнее, если у вас локальный каталог node_modules. Запустите эту команду из вашего каталога проектов:

npm i --save-dev eslint eslint-config-airbnb

(затем вы можете запустить eslint из ./node_modules/.bin/eslint)

2) Создайте файл .eslintrc в каталоге вашего проекта со следующей строкой.

{ "extends": "airbnb" }  // We installed airbnb style guide in step 1.

3) Резервное копирование/принятие файлов исходного кода

Сделайте резервную копию файлов, которые вы хотите скопить; следующая команда может изменить несколько строк.

4) Запустите eslint --fix следующим образом:

eslint --fix path/to/file.js

eslint --fix path/to/files/*.jsx

Это исправит десятки ошибок в ваших файлах!

5) Если eslint --fix останавливается из-за какой-либо ошибки, исправьте ее вручную, затем запустите снова

Я заметил, что eslint --fix не исправляет все ошибки за один раз. то есть он иногда будет работать до определенной точки в файле, а затем останавливаться на ошибках, которые он не может обработать автоматически.

Если вы удалите самую главную проблему, над которой eslint застрял, повторное выполнение команды исправит больше ошибок в файле. Промойте, повторите.

-

В 2015 году eslint добавил некоторые новые функции. Надеюсь, что опция "--fix" в будущем станет лучше: http://eslint.org/blog/2015/09/eslint-v1.5.0-released