gulp-templater
gulp-templater
Плагин созданный для быстрого создания HTML страниц, из исходных файлов сохраняя структуру папок страниц.
установка:
npm install --save
Главный шаблон в который встраивается содержимое страниц это обычная html страница, с добавленными в нужные места определенными полями.
По умолчанию всегда текст новой страницы в шаблоне буде заменять строку <%content%>
.
В страницы можно так же вставлять дополнительные части шаблонов которые повторяются на других страницах. Такие как меню, хэдер или футер.
Для их вставки в опциях нужно указать значение partials
с путем до папки с этими частями. Части должны иметь расширение .html
к примеру menu.html
.
В основном шаблоне занчение <%%menu%%>
будет заменено содержимым данного шаблона.
Все остальные поля берутся из самой страницы, оформленной в специальном формате.
Создание страницы проходит по такому сценарию.
- Берется исходный шаблон.
- Проверяются есть ли части которые вставляются в шаблон, если да они находятся и выполняется данная операция.
- Далее проходим по страницам и вставляем их с переменными в получившийся шаблон и сохраняем результат.
Пример страницы:
title: В шаблоне этот текст заменит переменную <%title%>foo_bar: В шаблоне этот текст заменит переменную <%foo_bar%>=====тут обычная html разметка страницы, в шаблоне она заменит переменную <%content%>
Пример шаблона:
<%title%> <%%menu%%> <%content%> <%foo_bar%>
Пример использования:
У нас есть шаблон, и есть группа папок со страницами, которые нужно превратить в html страницы сохраняя пути папок.
.
├── content
│ └── style.css
├── pages
│ ├── index.html
│ └── subfolder
│ └── second.html
├── partials
│ └── menu.html
└── template
└── layout
└── index.html
Нам необходимо на основе шаблона
source/template/layout/index.html
Построить список страниц находящихся в папке
source/pages
сохраняя их структуру папок и уровень вложенности.
var gulp = ;var templater = ; gulp;