使用 Headless Bundles 管理结构数据

Headless Bundles 让 Hugo 的内容管理更加模块化和灵活。

Headless Bundles 允许你在内容目录中存放与页面无关的结构化数据。通过在 Front Matter 中设置 headless: true，这些资源不会生成单独页面，但可在站点任意位置通过 .Site.GetPage 或资源管道读取。它适合维护团队成员列表、下载清单等可复用模块，使内容与布局更加解耦。结合资源处理功能，还可以在渲染前对图片或脚本进行优化，构建更灵活的内容组件。

Headless Bundles 概念

Headless Bundles 是 Hugo 的 Page Bundles 的一种特殊形式，不会生成独立的 HTML 页面，而是作为数据容器存在。它们可以包含：

Markdown 内容（用于元数据）
图片、文档等资源文件
子目录结构

配置方法

要创建 Headless Bundle，在页面的 Front Matter 中添加：

---
title: "Team Members"
headless: true
---

将文件放在 content/ 目录下，Hugo 会识别为 Headless Bundle。

访问方法

在模板中，通过 .Site.GetPage 访问 Headless Bundle：

{{ $headless := .Site.GetPage "/team" }}
{{ range $headless.Resources }}
  <img src="{{ .Permalink }}" alt="{{ .Title }}">
{{ end }}

或者使用资源管道：

{{ $bundle := .Site.GetPage "/data" }}
{{ $json := $bundle.Resources.Get "data.json" }}
{{ $data := $json | transform.Unmarshal }}

最佳实践

使用 Headless Bundles 管理可复用的内容模块，例如：

团队成员信息
合作伙伴列表
下载资源包

通过 Headless Bundles，可以在多个页面中复用相同的内容组件，而无需重复编写。

总结

Headless Bundles 是 Hugo 高级内容管理功能的核心，通过解耦内容和显示逻辑，提升了站点的模块化和可维护性。