Краткий ответ: беги npx poetic

Мы все там были; у нас есть новый проект, и мы хотим, чтобы он соответствовал лучшим практикам стиля кода. Преимущества очевидны - автоматические исправления синтаксиса и правильный формат звучат как мечта. Итак, мы спешим в Интернете, чтобы получить последний учебник о том, как настроить линтер, форматер и некоторые правила, но мы быстро понимаем, что это может быть сложно с множеством вещей, которые нужно сделать.

До сих пор процесс часто включал добавление множества зависимостей для инструментов, плагинов и правил линтинга (а также обеспечение их совместимости между ними), индивидуальную настройку каждого из них, настройку расширений в вашей среде IDE и, наконец, , долгий процесс настройки, чтобы все это работало вместе. Да, мы получили! Через несколько часов…

Линтеры и форматеры - прекрасные инструменты, но их настройка - непростая задача. Это часто отпугивает новых разработчиков, а у более опытных редко бывает время заниматься этим. В результате многие проекты заканчиваются некорректными конфигурациями стиля кода или вообще не имеют их.

Представляем Поэтический

Poetic - это пакет NPM с открытым исходным кодом, который автоматически устанавливает и настраивает ESLint, Prettier и EditorConfig с помощью рекомендуемых правил Airbnb и ESLint для JavaScript, TypeScript и React.

Цель Poetic состоит в том, чтобы упростить настройку и обслуживание инструментов и правил стилизации кода, позволяя при этом полную настройку.

npx poetic

Когда вы запускаете его, он добавляет необходимые файлы конфигурации в ваш проект и устанавливает для вас зависимости. Эта концепция аналогична create-react-app в том, что у вас есть одна зависимость, которая управляет подчиненными зависимостями, поэтому вы можете быть уверены, что они будут хорошо взаимодействовать.

В большинстве проектов используется похожий стиль кода. В последние годы в сообществе JavaScript был достигнут значительный прогресс в достижении консенсуса в отношении того, что считается хорошей практикой, и Руководство по стилю Airbnb является самым популярным из-за того, что оно -глубокое объяснение обоснования каждого правила. Однако не все проекты одинаковы, и для некоторых из них требуются особые правила, которые лучше всего подходят для них.

NPM: https://www.npmjs.com/package/poetic

Настройка Poetic для вашего проекта

Девиз Poetic - сделать инструменты стилизации кода доступными для любого проекта. Он полностью настраивается с использованием тех же файлов и конфигураций, к которым вы привыкли.

Вы можете установить свои собственные правила ESLint, TypeScript и Prettier, сохраняя при этом тщательно подобранный набор базовых правил, которые широко используются в сообществе JS.

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

Эта функция упрощает совместное использование конфигураций в проектах. Установив Poetic на всех из них, мы гарантируем, что все они будут иметь одинаковые базовые зависимости.

Это дружественная среда IDE

При наборе кода замечательно получать мгновенную обратную связь. Это увеличивает нашу продуктивность и уменьшает количество ошибок. Большинство современных редакторов поддерживают плагины или расширения. Poetic предварительно настроен для Visual Studio Code, но совместим с любым редактором. Кроме того, некоторые IDE, такие как WebStorm, уже поставляются с ними в готовом виде. Чтобы в полной мере воспользоваться этими функциями, обязательно установите следующее:

Это тоже дружелюбно к интерфейсу командной строки

Если вы хотите выполнить линтинг или форматирование из командной строки - возможно, с помощью обработчика предварительной фиксации (с Husky) или в конвейере CI - вы можете использовать один из сценариев NPM, добавленных Poetic в ваш package.json

  • yarn code:clean (ссылки и форматы)
  • yarn code:lint (только линт)
  • yarn code:format (только формат)

Есть еще одна удобная команда, которая проверяет все правила линтинга в поисках проблем совместимости. Используйте это, чтобы узнать, борется ли одно из ваших пользовательских правил ESLint с Prettier:

  • yarn code:check:rules (Проверяет совместимость правил)

Заключение

Как разработчики, мы хотим, чтобы наш код был как можно более элегантным, без необходимости тратить слишком много времени на инструменты для его выполнения. Poetic - это новая альтернатива, которая продвигает стиль кода и передовые методы, сводя к минимуму время настройки и обслуживания. Это ни в коем случае не предназначено для каждого проекта, но это исчерпывающая отправная точка, которая, надеюсь, будет вам полезна.

Содействие

Мы стараемся сделать Poetic полезным для всех. Это означает, что нужно пытаться понять потребности людей и внедрять универсальные решения, которые экономят ваше время. Мы только что запустили Poetic с поддержкой JS, TS и React, но мы планируем продолжить добавление поддержки и для других популярных настроек.

Пожалуйста, попробуйте. Установка занимает всего несколько секунд, и если вам это не нравится, просто отмените изменения.

Вопросы Github и запросы на извлечение приветствуются. Это прекрасная возможность одним из первых внести вклад в крутой проект с открытым исходным кодом. Если у вас есть идеи, которые вы хотели бы увидеть в Poetic, отправьте нам вопрос или напишите в Twitter.

Github: https://github.com/arianacosta/poetic

Расскажите ❤️ о Поэтическом