Как сделать перенос строки в коде PUG (Jade)?

В языке шаблонов Pug (ранее известном как Jade) для создания переноса строки используется специальное ключевое слово '|', которое обозначает, что следующая строка будет новой строкой.

Приведу примеры того, как можно использовать перенос строки в различных ситуациях в Pug.

1. Внутри одного элемента:

div
  p Это первая строка.
  p Это вторая строка.

Результат компиляции:

<div>
  <p>Это первая строка.</p>
  <p>Это вторая строка.</p>
</div>

2. Между элементами на одном уровне вложенности:

div
  p Это первая строка.
  | 
  p Это вторая строка.

Результат компиляции:

<div>
  <p>Это первая строка.</p>
  <p>Это вторая строка.</p>
</div>

3. Внутри атрибута элемента:

a(href='#')
  | Ссылка на
  br
  | новую строку

Результат компиляции:

<a href="#">
  Ссылка на<br>
  новую строку
</a>

4. Если нужно добавить несколько пустых строк в коде, можно использовать 'br' без текста:

p Это первая строка.
br
br
p Это вторая строка.

Результат компиляции:

<p>Это первая строка.</p>
<br>
<br>
<p>Это вторая строка.</p>

Таким образом, используя ключевое слово '|', можно легко добавлять переносы строк в коде Pug (Jade) для создания читабельного и организованного разметочного кода.