How do I prevent Pug from collapsing all whitespace between two tags?

问题

When I do this in a template:

div(class="field")
    label Password
    input(type="password")

I get this output:

<div class="field"><label>Password</label><input type="password"></div>

So the label and input tags have zero space between them, instead of the single space between them that they would have in a normal HTML file where they're on two different lines.

How do I get that standard single space between the two elements, in a Pug template, in the least ugly possible way? I could use CSS to fix the spacing, but that seems like a lot of verbosity to add, just to get what is a standard HTML feature when you aren't using Pug.

回答1:

The Pug documentation demonstrates how to control whitespace using pipe characters.

div(class="field")
    |
    |
    label Password
    |
    |
    input(type="password")

This should render:

<div class="field">
    <label>Password</label>
    <input type="password"/>
</div>

回答2:

This does what I want/expect (put exactly one space between the two elements, in the rendered HTML output).

div(class="field")
    label Password
    = ' '
    input(type="password")

Using the = operator at the beginning of a line allows you to insert a Javascript expression. So here, I'm inserting a string containing a single space.

来源：https://stackoverflow.com/questions/55961434/how-do-i-prevent-pug-from-collapsing-all-whitespace-between-two-tags