ESLint-плагин для сортировки элементов кода TS/JS

Я написал плагин для ESLint — Perfectionist. Он сортирует различные элементы кода, чтобы написанный разными людьми код выглядел единоообразно.

457

Все любят, когда код на проекте выглядит единообразно. Но, к сожалению, чем больше программистов на проекте, тем сильнее стилистически отличаются файлы в нём.

Эту проблему призваны решать линтеры, которые сигнализируют об ошибках в коде.

Я написал свой плагин для ESLint — Perfectionist.

Он призван решать проблему с сортировкой различных элементов кода, таких как импорты, объекты, TypeScript интерфейсы и типы, JSX-пропсы, методы классов и др.

Плагин на выбор предоставляет три типа сортировки: по алфавиту, естественная сортировка (схожая с алфавитной, но ближе к людям) и сортировка по длине строки (на скрине ниже пример как раз сортировки по длине строки).

На текущий момент ESLint Plugin Perfectionist насчитывает 12 правил и каждое можно настроить под себя.

Для того, чтобы начать использовать плагин на проекте, прежде всего, нужно установить сам ESLint:

			npm install --save-dev eslint

Далее, устанавливаем плагин:

			npm install --save-dev eslint-plugin-perfectionist

Самый простой способ начать использовать плагин это импортировать один из трёх готовых конфигов в свой .eslintrc конфиг. Например, конфиг с естественной сортировкой:

			{
  "extends": [
    "plugin:perfectionist/recommended-natural"
  ]
}

Подробнее о других конфигурациях и настройках отдельных правил в документации.

После чего линтер начнёт вам сигнализировать о куче проблем в коде, но, благо, все правила являются fixable. Это значит, что после установки ничего не нужно исправлять руками, достаточно выполнить команду eslint с флагом —fix и плагин везде всё поправит сам.

Спасибо за внимание!