跳转到内容
搜索文档

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_VERSION0.128.0

了解更多

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

这篇文档对您有帮助吗?