如何在 Hugo/Markdown 页面中包含另一个文件？答案

【问题标题】：How can another file be Included in a Hugo/Markdown page?如何在 Hugo/Markdown 页面中包含另一个文件？
【发布时间】：2017-01-25 04:10:49
【问题描述】：

最近有人给我重新开发了一个网站。重新设计的站点将在Markdown 中完成，并通过Hugo static site 生成器运行。

有没有办法在通过 Hugo 处理的 Markdown 网页中包含其他文件？如果是这样，怎么做？除非我遗漏了什么，否则Hugo docs 不会解决这个问题。

使用 HTML 和一些服务器（至少是 Apache），您可以执行以下操作：

<html>
<body>
Some content
<!--#include virtual="name_of_first_file_to_include" -->
More content
<!--#include virtual="name_of_second_file_to_include" -->
Still more content
</body>
<html>

我尝试创建一个模板页面，将“一些内容”和“更多内容”之类的内容放入模板中，然后将包含的内容放入我的 .md 文件中，该文件通过 {{ .Content }} 被“包含”在模板。但是，1）这似乎是使用模板的错误方式。 2) 如果需要，我还没有找到一种方法来引入更多文件。

【问题讨论】：

标签： markdown hugo

【解决方案1】：

对于内容文件，有两个选项：

短代码。功能强大且有文档记录。
使用mmark 作为带有include 功能的markdown 渲染引擎。将内容文件重命名为“*.mmark”。见https://github.com/miekg/mmark

我是 Hugo 的维护者。

【讨论】：

mmark 的 include 指令做了一些内容过滤，我错了吗？如果我想在其中包含一段带有脚本的原始 html 怎么办？（例如交互式图表）
我对 mmark 不熟悉，但我怀疑你可以将它包装在 div 中。但是还有第三种选择：Hugo 有一个名为 readFile 的模板 func，但要知道结果不会以任何方式缓存，所以如果你从一个频繁使用的模板中使用它，我建议你将它包装在 partialCached .
readFile 听起来不错：D 我没注意到！谢谢。所以我需要编写一个简码来包含原始文本。
记录在哪里，确切地？我浏览了所有寻找这个芽的 Hugo 文档，但没有看到它。 ://
请注意，mmark 在 Hugo 中已弃用，因此排除了选项 2。

【解决方案2】：

我有一个自定义简码，用于通过 Markdown 将我的静态演示文件呈现为代码，这很简单：

布局/简码/code.html

{{ $file := .Get "file" | readFile }}
{{ $lang := .Get "language" }}
{{ (print "```" $lang "\n" $file "\n```") | markdownify }}

content/post/some-post.md

 {{% code file="/static/some-script.js" language="js" %}}

【讨论】：

使用相对文件路径：{{ $filename := (path.Join $.Page.Dir (.Get "file")) }} {{ $file := $filename | readFile }} {{ $file | markdownify }}.
在较新的 Hugo 中，$.Page.Dir 变为 $.Page.File.Dir

【解决方案3】：

一位同事建议creating a shortcode 帮助解决这个问题。虽然这不是我的想法——它比我想要的更复杂——但还不错，而且我还没有找到更好的方法。因此，我使用shortcode 和 CSV 文件实现了一个解决方案。简单的示例文件如下：

内容文件仍然（大部分）是 Markdown，看起来像：

+++
date = "2016-09-29"
title = "short_code_test"
type = "pages"
+++

## Short Code test

Test table should appear below:  

{{< display_table_csv "static/test_data.csv" >}}
  <tr><th>Name</th><th>Birthday</th>
{{< /test_table_shortcode >}}

（请注意，type = "pages" 只是引入了一个模板，该模板修改/覆盖了 hugo-uno 默认 pages/single.html 模板，以使输出更清晰，以便在下面显示。）

布局/简码/display_table_csv.html：

<table>
  <thead>
      {{ .Inner }}
  </thead>
  <tbody>
  {{ $url := (index .Params 0) }}
  {{ $sep := "," }}
  {{ range $row_i, $row := getCSV $sep $url }}
  <tr>
    {{ range $col_i, $col := $row }}
    <td>{{ $col }}</td>
    {{ end }}
  </tr>
  {{ end }}
  </tbody>
</table>

静态/test_data.csv：

John, 1940-10-09
Paul, 1942-06-18
George, 1943-02-25
Ringo, 1940-07-07

这张图片显示了事物是如何呈现的：

Hugo docs 中的 Data-driven Content page 也很有帮助。

【讨论】：