跳转到内容
搜索文档

Hugo

最后更新 查看 MarkdownAgent 设置

Hugo ↗ 是用 Go 编写的静态站点生成工具。它速度极快,并提供高级、灵活的原语,用于通过不同内容格式 ↗管理内容。

在本指南中,你将创建新的 Hugo 应用并使用 Cloudflare Pages 部署。你将使用 hugo CLI 创建新的 Hugo 站点。

继续之前

所有框架指南都假定你已具备 Git ↗ 的基础知识。如果你是 Git 新手,请参阅这份精简 Git 手册 ↗,了解如何在本地设置 Git。

如果你使用 SSH 克隆,则必须在每台用于向 GitHub 推送或拉取的计算机上生成 SSH 密钥 ↗。

更多信息请参阅 GitHub 文档 ↗和 Git 文档 ↗。

若你已有托管在 Git 提供商 上的 Hugo 站点,可直接前往使用 Cloudflare Pages 部署。

安装 Hugo

根据操作系统,按照相应说明安装 Hugo CLI。

若使用包管理器 Homebrew ↗,在终端运行 brew install 命令安装 Hugo:

brew install hugo

若使用包管理器 Chocolatey ↗,在终端运行 choco install 命令安装 Hugo:

choco install hugo --confirm

若使用包管理器 Scoop ↗,在终端运行 scoop install 命令安装 Hugo:

scoop install hugo

Linux 发行版的包管理器可能包含 Hugo。若是,请直接使用发行版包管理器安装 Hugo——例如在 Ubuntu 中运行以下命令:

sudo apt-get install hugo

若包管理器不包含 Hugo,或你想直接下载发行版,请参阅手动安装部分。

手动安装

Hugo GitHub 仓库包含适用于各操作系统的 Hugo 命令行工具预构建版本,可在 Releases 页面 ↗ 找到。

有关安装这些发行版的更多说明,请参阅 Hugo 文档 ↗。

创建新项目

安装 Hugo 后,参阅 Hugo 快速入门 ↗ 创建项目,或在终端运行 hugo new 命令创建新项目:

hugo new site my-hugo-site

Hugo 站点使用主题自定义静态构建 HTML 站点的外观。在 themes.gohugo.io ↗ 上有许多可用主题——此处通过在终端运行以下命令使用 Ananke 主题 ↗:

cd my-hugo-site
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
echo "theme = 'ananke'" >> hugo.toml

创建文章

创建新文章为 Hugo 站点添加初始内容。在终端运行 hugo new 命令生成新文章:

hugo new content posts/hello-world.md

在 hello-world.md 中添加初始内容以创建文章。准备发布时,移除文章 frontmatter 中的 draft 行。设置了 draft: true 的文章将被 Hugo 构建过程跳过。

创建 GitHub 仓库

访问 repo.new ↗ 创建新的 GitHub 仓库。创建新仓库后,进入新创建的项目目录,在终端中运行以下命令,准备并将本地应用推送到 GitHub:

git remote add origin https://github.com/<your-gh-username>/<repository-name>
git branch -M main
git push -u origin main

使用 Cloudflare Pages 部署

要将站点部署到 Pages:

  1. 在 Cloudflare 仪表板中,前往 Workers & Pages 页面。

    Go to Workers & Pages ↗
  2. 选择 Create application(创建应用程序)。

  3. 选择 Pages 选项卡。

  4. 选择 Import an existing Git repository(导入现有 Git 仓库)。

  5. 选择你创建的新 GitHub 仓库,然后选择 Begin setup(开始设置)。

  6. 在 Set up builds and deployments(设置构建和部署) 部分,提供以下信息:

Configuration optionValue
Production branchmain
Build commandhugo
Build directorypublic

public 是 Hugo 站点的默认构建目录,可通过 publishDir 设置 ↗ 配置。

完成部署配置后,选择 Save and Deploy(保存并部署)。你将看到 Cloudflare Pages 安装 hugo 和项目依赖并构建站点,然后完成部署。

部署站点后,你将在 *.pages.dev 上获得项目的唯一子域名。 每次向 Hugo 提交新代码时,Cloudflare Pages 都会自动重新构建并部署项目。你还可以在新 pull request 上获得预览部署,在部署到生产环境之前预览更改效果。

使用特定或较新的 Hugo 版本

要使用 Hugo 的特定或较新版本 ↗,在 Pages 项目 > Settings(设置) > Environment variables(环境变量) 中创建 HUGO_VERSION 环境变量。将值设置为要指定的 Hugo 版本(最低推荐版本请参阅 Prerequisites ↗)。

例如,HUGO_VERSION:0.128.0。

了解更多

完成本指南后,你已成功将 Hugo 站点部署到 Cloudflare Pages。要开始使用其他框架,请参阅框架指南列表。

这篇文档对您有帮助吗?