有没有办法直接在玉中包含 html 文件或片段？答案

【问题标题】：Is there a way to include html file or snippet directly in jade?有没有办法直接在玉中包含 html 文件或片段？
【发布时间】：2013-07-27 22:54:03
【问题描述】：

我有一组 html 文件，大部分是静态的，我想移动到我的 node.js/express/jade 项目。在jade中直接包含html文件或sn-p的正确方法是什么？我不想将现有的 html 文件翻译成玉？

【问题讨论】：

标签： node.js pug

【解决方案1】：

您应该可以在翡翠模板中简单地include it：

如前所述，include 可用于包含其他内容，例如 html 或 css。通过提供扩展名，Jade 将读入该文件，应用与文件扩展名匹配的任何 filter，并将该内容插入到输出中。

html
  // ...
  body
    // ...
    //- html files have no filter and are included verbatim
    include content.html

【讨论】：

这是否意味着您可以通过这种方式将原始 SVG 导入 Jade 标记？
我仍然发现包含的 html 文件上的缩进需要正确格式化。奇怪但真实。
如何将include与变量中的文件名一起使用？

【解决方案2】：

在确切的html代码之前使用:verbatim或直接在jade中使用sn-p。

doctype html
html(lang="en")
  :verbatim
    {% include head.html %}
  body
    :verbatim
    {{ content }}

  :verbatim
    {% include footer.html %}

输出

<!DOCTYPE html>
<html lang="en">{% include head.html %}
  <body>{{ content }}
  </body>{% include footer.html %}
</html>

【讨论】：

你很高兴知道 :verbatim。我在jade-lang.com 文档中找不到这个，但它确实有效。这是我发现在 Jade 中包含多行代码片段和其他预格式化文本的唯一合理可维护的方式。
什么版本：逐字适用于请？ Jade 1.11.0 不理解该声明
新版Jade，改名为Pug，看不懂:verbatim.

【解决方案3】：

在我的 .jade 文件中，我必须这样做：

:verbatim
   !{editorBody}

.. editorBody 是通过 res.render() 调用提供的：

var editorBody = '<p>Hello</p>';

return res.render('user/user_profile', {editorBody : editorBody});

【讨论】：

什么版本：逐字适用于请？ Jade 1.11.0 不理解该声明