Настройка Prettier для автоматического форматирования кода
Начинайте с глобальной установки Prettier через менеджер пакетов, например:
npm install —save-dev prettier. Это добавит инструмент в ваш проект и обеспечит единый стиль форматирования.
Создание файла конфигурации
Создайте файл .prettierrc в корне проекта. В нем укажите основные параметры, например:
- tabWidth: 2 – задает количество пробелов для отступов
- singleQuote: true – использует одинарные кавычки
- semi: false – убирает точку с запятой в конце строк
- printWidth: 80 – устанавливает предел длины строки
Пример файла:
{ "tabWidth": 2, "singleQuote": true, "semi": false, "printWidth": 80 }
Добавление команд в скрипты
В файл package.json добавьте следующий раздел:
"scripts": { "format": "prettier --write "src/**/*.{js,jsx,ts,tsx,css,scss,json}"" }
Это позволит запускать автоматическое форматирование командой:
npm run format.
Интеграция с редактором
Установите плагин Prettier для используемого редактора (например, VS Code). Настройте автоматическое форматирование при сохранении файла, добавив в настройки:
"editor.formatOnSave": true, "prettier.requireConfig": true
Это обеспечит единый стиль без необходимости запускать команду вручную.
Дополнительные советы по настройке
- Используйте editorconfig: создайте файл .editorconfig с настройками, совместимыми с Prettier, для унифицированных отступов и переносов.
- Автоматизация проверки: добавьте команду проверки форматирования в CI/CD, например, через prettier —check.
- Настройка игнорируемых файлов: создайте файл .prettierignore для исключения папок и файлов, не требующих форматирования.
Следуя этим шагам, вы достигнете единых стандартов оформления кода и ускорите процесс разработки.