В языке шаблонов Pug (ранее известном как Jade) для создания переноса строки используется специальное ключевое слово '|', которое обозначает, что следующая строка будет новой строкой.
Приведу примеры того, как можно использовать перенос строки в различных ситуациях в Pug.
- Внутри одного элемента:
div p Это первая строка. p Это вторая строка.
Результат компиляции:
<div> <p>Это первая строка.</p> <p>Это вторая строка.</p> </div>
- Между элементами на одном уровне вложенности:
div p Это первая строка. | p Это вторая строка.
Результат компиляции:
<div> <p>Это первая строка.</p> <p>Это вторая строка.</p> </div>
- Внутри атрибута элемента:
a(href='#') | Ссылка на br | новую строку
Результат компиляции:
<a href="#"> Ссылка на<br> новую строку </a>
- Если нужно добавить несколько пустых строк в коде, можно использовать 'br' без текста:
p Это первая строка. br br p Это вторая строка.
Результат компиляции:
<p>Это первая строка.</p> <br> <br> <p>Это вторая строка.</p>
Таким образом, используя ключевое слово '|', можно легко добавлять переносы строк в коде Pug (Jade) для создания читабельного и организованного разметочного кода.