Программирование
June 8, 2019

PUG - Шаблонизатор HTML


Задача данного шаблонизатора расширить функционал HTML. С помощь PUG не придётся переписывать каждую HTML страницу, достаточно внести изменения всего лишь в один файл. Для больших проектов он крайне необходим.


Плюсы данного шаблонизатора:

  • Компилятор всегда подскажет о наличии ошибок во вложенности.
  • Необязательно использовать скобки, компилятор делает это автоматически.
  • Можно использовать циклы, переменные и условия.


Особенности компилятора:

  • Можно использовать либо табы или пробелы.
  • Если не указывать тег в коде с классом и индификатором, то компилятор автоматически считает его за div

Установка:

  1. Node.js
  2. PUG
  3. Если не стоит node.js последней версии, то заходите на GitHub


Чтобы узнать возможность шаблонизатора в консоли вбиваем:

pug --help


Чтобы скомпилировать файл в консоли вбиваем:

pug -w название файла
pug -w *.pug (скомпилирует все файлы)


Отменяем минификацию:

pug --pretty название файла


Полезные функции шаблонизатора:

  • Инклюды - позволяют применять одинаковые блоки кода в разных файлах, с помощь одной строчки. Все измениния кода производятся в одном файле с инклюдом.

Вызываем инклюды:

include назавание папки с модулем / название файла

  • Шаблоны - это заготовки для определённых типов страниц с определёнными условиями.

Вызываем шаблоны:

extends назавание папки с шаблонами / название файла

  • Мимиксины - определённые повторяющиеся участки кода, которые встречаются на всём сайте. Могут быть полностью одинаковыми либо с нещначительными изменениями.

Делаем мимиксины:

в файле pug прописываем: mixin название миксина. Длаее пишим pug код который будет повторяться.
Вставляем миксин: +название миксина(пишим без пробела)
Дублируем нужное колличество раз.