在 Jade 的行尾添加一个空格

Posted 2023-03-03

【中文标题】在 Jade 的行尾添加一个空格

【英文标题】：Add a whitespace at the end of the line in Jade

【发布时间】：2012-05-17 23:26:36

【问题描述】：

我有这个jade 代码：

p
    | Avatar hosted by
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

问题是，它被渲染到

<p>Avatar hosted by<a href="http://www.gravatar.com/" target="_blank">Gravatar</a></p>

看起来像：“头像托管者Gravatar”。

无论我在文本行末尾添加多少空格，它仍然是这样的。文档无法帮助我，我无法想象这是一个如此罕见的问题。

【参考方案1】：

如果您不想在代码中使用内联 html 或 HTML 实体，您可以这样做：

p
    | Avatar hosted by
    =  ' '
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

或者这个更短

p= 'Avatar hosted by '
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

最干净的大概是这个

p Avatar hosted by #''
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

【参考方案2】：

你用的是哪个版本的玉？我刚刚测试（使用 0.25.0）在 'by' 后面有一个空格，它工作正常。

其他选项有：

p
    | Avatar hosted by 
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

或

p
    | Avatar hosted by
    |  <a href='http://www.gravatar.com/' target='_blank'>Gravatar</a>

【讨论】：

貌似我没有在package.json中添加版本约束。

很高兴知道最近的版本不会删除文本块末尾的所有空格和换行符。

它可能不会剥离，但您的编辑器可以。如果有更简单的方法就好了。

【参考方案3】：

Jade 现在支持内联标签的插值。

p this is #[strong test] of how jade will treat #[i #[u inline tags]]... like #[a(href="/") anchor tags] and #[+a() mixins].

http://jade-lang.com/reference/interpolation/

【参考方案4】：

你确定不是你的编辑？我使用 Komodo，它被设置为在保存时去除尾随空格。当我保存文件时，它正在剥离我的文本行末尾的空间。在我弄清楚之前，我的文本和链接之间没有空格让我发疯。我更改了 Komodo 的设置（首选项-> 编辑器-> 保存选项）以取消选中去除尾随空格，问题就消失了。

【讨论】：

这也是我的问题。在 Web Storm 中禁用此功能，请转到首选项并搜索尾随。在页面底部的“其他”下有一个选项“在保存时去除尾随空格”。

【参考方案5】：

我在新行使用space 变量。这个：

p
    | You must follow
    =space
    a(href=default_url) this link

【参考方案6】：

编辑： 正如 jmar777 所指出的，最新版本的翡翠应该尊重尾随空格see here。太棒了，我可能会在以后的项目中再次尝试使用玉。

编辑： 更新了玉解析器的链接。 Original link 用于玉 1.11。

【讨论】：

| a(href='http://www.gravatar.com/', target='_blank') Gravatar 将按原样输出（而不是

@RolandBertolom 我不确定是否会否决一个已有两年历史的问题，因为框架已经改变是处理保持一致历史数据的正确方法。为什么不建议编辑或评论它已更改？你可以看到这个问题的公认答案和我的完全一样......显然Jade已经改变了。

@lfender6445 谢谢。我已经更新了当前版本的翡翠解析器，并保留了翡翠 1.11 的原始链接。

【参考方案7】：

一个快速而干净的解决方案是使用以下语法：

p
    | Avatar hosted by
    | 
    a(href='http://www.gravatar.com/', target='_blank') Gravatar

注意第二个文本行中| 后面的空格。这将在前一行的文本之后添加一个空格（如果您忘记添加它，还会吐出一个令人讨厌的错误！）。

在我看来，这是迄今为止最干净的选择。

【参考方案8】：

我正在使用 Harp，Óscar Gómez 的 solution with two pipes 会引发错误，尽管它看起来非常优雅。

感谢 Даниил Пронин 和 Sean Gravener，我发现这些解决方案对我有用：

#' '

!' '

和

= " "

p
  | Avatar hosted by #' '
  a(href='http://www.gravatar.com/', target='_blank') Gravatar

和

p
  | Avatar hosted by
  = ' '
  a(href='http://www.gravatar.com/', target='_blank') Gravatar

另外，如果您遇到相反的情况： 跨度文本 # ref + [' ']

这里有更多关于 Pug (Jade) 中的语法插值： https://pugjs.org/language/interpolation.html