Как настроить filewatcher в webstorm для компиляции jade/pug с табами?

от
prokoding.ru > Pug > Как настроить filewatcher в webstorm для компиляции jade/pug с табами?

Чтобы настроить filewatcher в WebStorm для компиляции Pug-шаблонов с использованием табуляции, следуйте этим шагам:

  1. Откройте WebStorm и перейдите в меню "File" (Файл) -> "Settings" (Настройки) (или используйте хоткей "Ctrl + Alt + S".
  2. В окне "Settings" (Настройки), найдите вкладку "Tools" (Инструменты) и выберите "File Watchers" (Наблюдатели файлов).
  3. В правой части окна "File Watchers" (Наблюдатели файлов), нажмите "+" (добавить новый наблюдатель файла).
  4. Выберите "Pug" из выпадающего списка "File type" (Тип файла).
  5. В поле "Program" (Программа), укажите путь к исполняемому файлу Pug-компилятора. Обычно это что-то вроде: /usr/bin/pug или C:UsersusernameAppDataRoamingnpmpug.cmd, в зависимости от вашей операционной системы и установки Pug.
  6. В поле "Arguments" (Аргументы), укажите следующую команду: --pretty --outfile $ProjectFileDir$/$FileNameWithoutExtension$.html $FileName$.
  • --pretty говорит компилятору сохранять отформатированный код с отступами.
  • --outfile $ProjectFileDir$/$FileNameWithoutExtension$.html указывает компилятору сохранить скомпилированный HTML-файл в той же папке, что и исходный Pug-файл, с тем же именем, но расширением .html.
  • $ProjectFileDir$ и $FileNameWithoutExtension$ - это переменные WebStorm, которые будут заменены на соответствующие значения при запуске filewatcher.
  • $FileName$ - это переменная, которая будет заменена на имя Pug-файла, над которым вы работаете.
  1. Удостоверьтесь, что опция "Auto-save edited files to trigger the watcher" (Автоматическое сохранение отредактированных файлов для запуска наблюдателя) включена. Она управляет тем, какие файлы будут подвержены компиляции при сохранении.
  2. Остальные опции можно оставить по умолчанию, если вы не хотите внести конкретные изменения.
  3. Нажмите "OK" для сохранения настройки filewatcher.
  4. Теперь, при сохранении Pug-файла в WebStorm, filewatcher будет автоматически компилировать его в отформатированный HTML-файл с использованием табуляции.

Убедитесь, что вы установили Pug-компилятор локально или глобально перед настройкой filewatcher в WebStorm. Вы также можете указать путь к установленному Pug-компилятору вручную, если он не обнаружен автоматически.

Обратите внимание, что эти шаги могут незначительно отличаться в зависимости от версии WebStorm и операционной системы. Если у вас возникнут проблемы с настройкой filewatcher, пожалуйста, обратитесь к официальной документации WebStorm или задайте вопрос на форуме поддержки JetBrains.