Блочная вёрстка в Pug представляет собой концепцию, которая позволяет разбить веб-страницу на отдельные блоки, каждый из которых может быть стилизован и размещен по месту. Pug - это шаблонизатор HTML, который позволяет упростить и улучшить процесс написания разметки веб-страницы.
Одной из основных особенностей блочной вёрстки в Pug является возможность повторного использования одних и тех же блоков разметки на разных страницах. Вместо того, чтобы копировать и вставлять один и тот же код блока на каждой странице, вы можете определить его в отдельном файле и просто импортировать его в нужном месте каждой страницы.
Процесс создания блоков разметки начинается с определения имени блока с помощью ключевого слова "block". Например, если вы хотите создать блок заголовка, вы можете написать следующий код:
block header
h1 Заголовок страницы
Определение блока заканчивается тегом новой строки. Затем вы можете добавить содержимое блока, чтобы задать его внутреннюю структуру. Например, чтобы добавить подзаголовок, вы можете использовать:
block header
h1 Заголовок страницы
h2 Подзаголовок
Теперь, когда блок заголовка определен, вы можете использовать его на разных страницах. Для этого в каждой странице, где вы хотите использовать этот блок, просто определите его как расширение с помощью ключевого слова "extends" и указания пути к файлу, содержащему блок:
extends layout.pug
block header
h1 Заголовок страницы
p Некоторый текст
Вот и всё!
Теперь блок header будет включен в каждую страницу, расширяющую файл layout.pug, и каждая страница сможет изменить содержимое и стилизацию заголовка, при необходимости.
Блочная вёрстка в Pug также поддерживает наследование, что позволяет вам создавать базовые шаблоны для различных частей вашего веб-сайта.