用 Cloudflare Workers 部署 Hugo 静态博客

起因

今天本来打算用 Cloudflare Pages 跑一个静态博客，但在新建项目时看到提示：

我们建议在新项目中使用 Cloudflare Workers。
请在我们的兼容性矩阵中查看 Workers 与 Pages 的比较。

于是我就研究了一下，发现其实 Cloudflare Workers 也能直接部署 Hugo 静态博客，而且过程非常简单。

1. 安装 Hugo

首先需要在本地安装 Hugo。

sudo apt install hugo

安装好后检查一下版本：

hugo version

2. 初始化博客项目

创建一个新的 Hugo 站点：

hugo new site blog
cd blog

接下来挑选一个主题，例如 Diary。把主题拉到本地：

git init
git submodule add -b main https://github.com/AmazingRise/hugo-theme-diary.git themes/diary

然后复制主题的 exampleSite 配置文件：

cp -r themes/diary/exampleSite/* .

这样站点就具备了可运行的配置和示例内容。

本地启动预览：

hugo server -D

浏览器打开 http://localhost:1313，可以看到主题示例站点。

3. 配置 `wrangler.jsonc` 部署设置文件

{
  "name": "example-com",
  "compatibility_date": "2025-07-20",
  "assets": {
    "directory": "./public",
    "html_handling": "auto-trailing-slash",
    "not_found_handling": "404-page",
    "run_worker_first": false
  },
  "build": {
    "command": "hugo build --gc --minify"
  },
  "workers_dev": true,
  "preview_urls": true
}

4. 推送到 GitHub

接下来把项目推送到 GitHub 仓库（Workers 会直接拉取这个仓库进行构建）：

git add .
git commit -m "init hugo blog"
git remote add origin git@github.com:你的用户名/仓库名.git
git push -u origin main

5. 在 Cloudflare Workers 部署

这里是关键步骤。

登录 Cloudflare 控制台
进入 Workers & Pages → Workers
点击 创建应用程序
选择 连接到 Git 仓库
选择刚刚推送的 Hugo 博客仓库
点击部署

Cloudflare Workers 自带 Hugo 构建环境，不需要你在本地写额外的 wrangler.json 或安装 wrangler CLI。只要仓库里有 Hugo 项目，Workers 就能直接完成构建和托管。

6. 访问博客

部署完成后，你会得到一个 Workers 的域名，例如：

https://你的项目名.你的账号.workers.dev

当然你也可以在 Cloudflare 控制台里给它绑定自定义域名。

最后修改于 2025-08-23

起因