使用 jade 的 "pretty" 选项时，如何防止单个块中的元素之间出现空格？

Question

总的来说，我喜欢漂亮的选项。我希望我的 html 易于阅读并且 pretty 有帮助。但有时它会成为阻碍。例如。

x.do-not-care-about-spaces It can go either way here.

y.please-no-spaces These
y.please-no-spaces Should
y.please-no-spaces Touch

我想看的是：

<x class="do-not-care-about-spaces">It can go either way here.</x>
<y class="please-no-spaces">These</y><y class="please-no-spaces">Should</y><y class="please-no-spaces">Touch</y>

但我看到的是

<x class="do-not-care-about-spaces">It can go either way here.</x>
<y class="please-no-spaces">These</y>
<y class="please-no-spaces">Should</y>
<y class="please-no-spaces">Touch</y>

我知道有几种方法可以解决这个问题（使用 css，将 html 放入 jade 文件中），但我希望的是一种 jade-y 方式正在做。

编辑： 使用示例标签更新了示例，而不是 div。我特别询问 controlling spaces between DOM nodes in jade's HTML output，而不是视觉 space 元素之间的呈现的网页。

Answer 1

一个 <div> 元素占据了整行，所以它也被这样渲染是有道理的。

我想你需要的是<span>标签

span.no-space These
span.no-space Will
span.no-space Touch

<span class="no-space">These</span><span class="no-space">Will</span><span class="no-space">Touch</span>

顺便说一句，还有内联 #[…] 语法，如果您将标签放在一行中，这会更有意义

#[span.no-space These]#[span.no-space Will]#[span.no-space Touch]

请注意，虽然此语法不会使 div 出现在一行中，但您仍然必须使用 span。

Answer 2

还有一个similar question on the github repo and the essential comment是：

No, it is not currently possible to force only part of the document into pretty/normal mode. The general recommendation for this is to use the normal (non-pretty) mode which is the default for exactly this reason. You can explicitly add white space using = ' ' (on its own line) when actually needed for the formatting of the page.

使用 jade 的 "pretty" 选项时，如何防止单个块中的元素之间出现空格？

When using jade's "pretty" option, how do I prevent spaces between elements in a single block?

html

node.js

pug