Pug:强制在行尾添加空白

Question

所以我有这个基本的哈巴狗代码

p This is some text
  span foo
  span bar

预期的输出如下所示:

这是一些文字foo栏

但是，它实际上输出以下内容(删除了空格):

这是一些文字foobar

可以通过在行尾添加一个空白区域来添加空间。

尽管在编辑器中启用了空白修剪功能后，我仍需要保留空白。保存文件时，空白修剪会删除行尾的空白。

那么，即使在编辑器中打开了空白修剪功能，有没有一种方法可以强制将空白添加到保留的行的末尾？

Answer 1

实际上，还有另一种方式。在跨度中的每个单词之前添加额外的空格将导致在浏览器中查看时，文本不会合并为一个单词。

// no extra spaces
p This is some text
  span foo
  span bar

// extra space method
p This is some text
  span  foo
  span  bar

// JS literals method
p This is some text!{' '}
  span foo
  | !{' '}
  span bar

额外的空间方法比我之前发布的JS文字方法更干净，但是它导致空格被放置在span内而不是其周围。

使用多余的空间方法将产生以下HTML:

<p>This is some text<span> foo</span><span> bar</span></p>

使用JS文字方法生成以下HTML:

<p>This is some text <span>foo</span> <span>bar</span></p>

不使用任何一种方法的HTML输出:

<p>This is some text<span>foo</span><span>bar</span></p>