在 Cloudflare Pages 上部署 Hexo 博客是一个非常流行且高效的选择，它可以为你提供免费的托管、全球 CDN 加速和自动化的部署流程。

🚀 部署 Hexo 到 Cloudflare Pages

整个过程的核心是：将你的 Hexo 博客源代码推送到 GitHub（或其他 Git 提供商），然后授权 Cloudflare Pages 读取你的代码仓库，并自动完成构建和部署。

1. 准备工作

在开始之前，请确保你已经准备好以下内容：

  • 一个可以正常运行的本地 Hexo 博客项目。
  • 一个 GitHub 账号。
  • 一个 Cloudflare 账号。
1.1 第一步：将 Hexo 源码推送到 GitHub

Cloudflare Pages 需要从 Git 仓库拉取代码。如果你还没有把博客源码上传到 GitHub，请按以下步骤操作（如果已有仓库，跳过此步）：

  1. 在 GitHub 上新建仓库（例如命名为 my-hexo-blog）。
  2. 在本地 Hexo 根目录打开终端（CMD/PowerShell/Terminal），执行以下命令：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

# 初始化 Git（如果从未初始化过）
git init

# 添加所有文件（注意：不要上传 public 文件夹，那是生成的）
git add .

# 提交更改
git commit -m "First commit"

# 关联远程仓库（把下面的 URL 换成你刚才在 GitHub 建的仓库地址）
git remote add origin https://github.com/你的用户名/仓库名.git

# 推送到 GitHub
git push -u origin master
# (如果现在的默认分支是 main，则用 git push -u origin main)

重要提示：确保你的根目录下有 .gitignore 文件，并且里面包含了 public/ 和 node_modules/。请确保你推送的是整个 Hexo 项目的源代码（包括 source/ 目录、themes/、_config.yml 等），而不是 hexo generate 生成的 public 目录。我们要上传的是源码，不是生成的网页。

2. 部署步骤

步骤 操作指南
第一步 登录到你的 Cloudflare 仪表板。
第二步 在导航栏中，选择 Workers & Pages。
第三步 点击 Create application > 选择 Pages 选项卡 > 点击 Connect to Git。
第四步 选择你的 GitHub 账号并授权 Cloudflare 访问。然后，选择你存放 Hexo 博客源代码的仓库。
第五步 点击 Begin setup，然后进入构建配置页面。这是最关键的一步。
第六步 配置构建设置（详情见下表），然后点击 Save and Deploy。
第七步 Cloudflare Pages 会开始第一次构建和部署。这个过程可能需要几分钟。完成后，你将获得一个 *.pages.dev 的免费域名，通过它就可以访问你的博客了！

🛠️ 关键构建配置

在上面的第五步中，你需要正确填写构建信息。Cloudflare 可能会识别出是 Hexo 项目并自动填充，但最好还是手动检查一下。

配置项 推荐值 说明
Project name 你的项目名 可以自定义，例如 my-hexo-blog。
Production branch main 或 master 选择你 Git 仓库的主分支。
Build command npx hexo generate 这是告诉 Cloudflare 如何构建你的 Hexo 站点的命令。
Build output directory public Hexo 生成静态文件的默认目录。
Environment variables NODE_VERSION = 18 （强烈推荐） 为了避免构建失败，建议添加一个环境变量，指定 Node.js 的版本，例如 18 或 20。

✨ 后续步骤

  • 自动更新：完成首次部署后，每次你向 GitHub 的主分支执行 git push，Cloudflare Pages 都会自动重新构建和部署你的博客，整个过程完全自动化。
  • 绑定自定义域名：你可以在 Cloudflare Pages 项目的 “Custom domains” 选项卡中，轻松地将你自己的域名（例如 yourblog.com）绑定到你的博客上。
  • 更新命令如下
1
2
3
git add .
git commit -m "update blog"
git push