使用Jade呈现的HTML值中的额外空格

Question

每次我在Jade中编写HTML时,我都会在每个元素的值之后添加额外的空格.

例如,我的Jade模板中会有这样的一行:

label(for="keyword") Keyword

渲染时,源代码如下所示:

<label for="keyword_1">Keyword
          </label>

用我的CSS搞乱那个额外的空白乱七八糟的问题.另外,它看起来并不整洁:)

有谁知道我怎么能防止插入？

Answer 1

检查底部的更新

我假设您正在使用express- 请检查您的应用设置.

app.set('view options', { pretty: false })

如果你jade在pretty模式(pretty: true)中进行渲染,那么它将使用嵌套缩进来排列生成的源(标记).关闭漂亮的打印应解决您的问题(但请确保您没有尾随空格,如@alessioalex所指出的).

如果你有理由要求你输出漂亮的格式(客户端规范,在我的情况下),那么你可以尝试其他一些东西.我在textarea标签上遇到了类似的问题; 令人沮丧的是因为空格实际上被注入到表单的内容中.我解决这个问题的方法是嵌入带有结束标记的文字html:

<textarea name="someField"></textarea>

该文档可以给你一些更多的细节(搜索html在这种情况下).在github上有一个开放的问题#341,它建议像scalate这样的方法,但它目前不适用jade(从版本开始0.19.0).

HTH

更新

好的 - 微妙而酷...有一种更好的方法来保持性感的输出pretty: true并避免标签内部的间距(我的textarea例子)......我只是尝试将一个附加.到标签的末尾(参见代码)并且它Just Worked™ :-)

form(name='frmname', method='POST')
  textarea(name='someField').

呈现:

<form name="frmname" method="POST">
  <textarea name="someField"></textarea>
</form>

美女!

为什么这样做？因为jade将.标记上的后缀视为标记将包含文本块(仅)的指示符,然后不提供任何文本块,因此它默认为''空字符串.