Настройка ES-Lint, AirBnB

В основном это настраивается как личная шпаргалка / напоминание, потому что поиск в Интернете четких инструкций - это то, что нужно сделать только один раз.

Это настраивается для проекта React, если это может помочь кому-то еще, это здорово.

Шаг 1. Настройка файла package.json

Судя по чтению в Интернете, люди рекомендовали устанавливать расширения linting локально, а модуль eslint — на вашем компьютере.

Логика заключалась в том, что можно использовать разные расширения линтинга в зависимости от проекта, над которым они работают, но модуль eslint всегда будет одним и тем же.

В итоге я решил установить все как dev-зависимость, потому что мой локальный eslint искал свои зависимости конфигурации локально, а не в проекте. Может быть, я делал что-то еще не так, и это было лишним, но это решило мою проблему… Я считаю это победой.

{
  ...
  “devDependencies”: {
    ...  
    “babel-eslint”: “^7.1.1”,
    “eslint”: “^3.11.0”,
    “eslint-config-airbnb”: “^13.0.0”,
    “eslint-plugin-import”: “^2.2.0”,
    “eslint-plugin-jsx-a11y”: “^2.2.3”,
    “eslint-plugin-react”: “^6.7.1”,
  },
  ...
  “scripts”: {
    ...
    “lint”: “eslint src”,
 }
}

Это соответствующая информация из моего файла package.json. Основной сбой, на исправление которого потребовалась целая вечность, заключался в запуске esling-plugin-jsx0a11y с версией ^3.

Копирование этого снайпера должно решить все.

Шаг 2. Настройка файла .eslintrc

Когда дело доходит до файла .eslintrc, я не уверен в необходимости ключа parser, однако, поскольку мой код работает с ним, я оставлю его, чтобы не рисковать поломкой.

{
  "parser": "babel-eslint",
  "env": {
    "browser": true,
    "node": true,
    "mocha": true
  },
  "extends": "airbnb",
  "plugins": [
      "react",
      "jsx-a11y",
      "import"
  ]  
}

Шаг 3: Запуск скрипта

Теперь все готово, последняя часть — ввести команду thenpm run lint -s. Флаг -s нужен для того, чтобы консоль не отображала гигантский красный блог ошибок каждый раз, когда линтер предупреждает вас о чем-то.

Я немного повозился с добавлением --watch в линтер, чтобы понять, что, поскольку возвышенное выделяло для меня «опечатки» внутри редактора, этого было достаточно, и я просто запускал скрипт перед каждой фиксацией в системе управления версиями.

Все сделано.