Hugo - 页面包中的相对路径答案

【问题标题】：Hugo - relative paths in page bundlesHugo - 页面包中的相对路径
【发布时间】：2019-04-27 02:35:21
【问题描述】：

很抱歉这个基本问题，但我刚刚开始使用 Hugo，我不知道如何链接到页面包中的图像。

我的内容文件夹中有以下结构：

content/
├── about
│   └── index.md
└── post
    ├── post01
    │   ├── img01.png
    │   └── index.md
    └── post02
        ├── img01.png
        └── index.md

根据我对page resources 文档的阅读，听起来页面包中的页面资源应该具有相对路径。基于此，我认为我可以使用以下降价从 post01 index.md 中链接到 img01.png：

![](img01.png)

但是，我就是无法让它发挥作用。我可以让它工作的唯一方法是将我的图像放入 /static 文件夹（与 /content 处于同一级别），然后降价将加载图像而不进行任何修改。所以看起来相对路径没有按照我认为的方式工作，因为我指定的任何路径都是相对于 /static 文件夹的。有人可以帮助我了解发生了什么吗？

另一个令人困惑的地方是，如果我将我的 /content/post 文件夹重命名为 /content/posts，然后重新启动我的本地 hugo 服务器，我的任何帖子都不会再加载到首页，我什至无法浏览到它使用 URL localhost:1313/posts （尽管 localhost:1313/about 仍然可以正常加载）。是什么原因导致首页自动列出/content/post的内容而不是/content/posts的内容，是什么原因导致我无法浏览到localhost:1313/posts？

非常感谢！

【问题讨论】：

标签： hugo

【解决方案1】：

这里其实有三个问题。

问题 1 - 页面捆绑图片。

MarkDown 由不知道页面包的 BlackFriday 模块处理。您将需要使用图像标签和一些短代码来获取它。比如：

{{ with .Resources.Match "image01.png" }}
   <img src="{{ .RelPermalink }}" width="{{ .Width }}" height="{{ .Height }}">
{{end}}

见hugo image processing page

问题 2 - 帖子与帖子（首页）

如果没有关于您的主题和布局的大量信息，这实际上很难回答。但作为一个猜测......

在生成 index.hml 的模板中的某处，会有如下内容：

{{ range .Section "post" }}

通过移动内容，您更改了部分名称。按照惯例，节名是单数的。

问题 3 - 帖子与帖子（hugo 服务器）

hugo server 从内存中提供页面。它没有使用您的文件系统。所以，如果一个目录没有构建的内容，那么它就不能被浏览。要确切了解hugo server 将提供什么服务（带有路径），然后只需构建并查看public/ 目录。

【讨论】：