【问题标题】:Add a whitespace at the end of the line in Jade在 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”。

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

【问题讨论】:

    标签: node.js express pug


    【解决方案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&nbsp;
          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

            【讨论】:

              猜你喜欢
              • 1970-01-01
              • 1970-01-01
              • 1970-01-01
              • 2018-11-07
              • 1970-01-01
              • 2018-12-08
              • 2016-04-26
              • 1970-01-01
              • 1970-01-01
              相关资源
              最近更新 更多