本文章将介绍如何使用 Hexo 在 Cloudflare Pages 上部署属于自己的博客网站。

准备阶段

本文预设你已拥有一个自己的域名。

安装阶段

安装 Node.js

前往官网下载 Node.js，你可以选择 LTS 版本，也可以选择最新版本。
下载好后，运行 Node.js 安装程序，你可以安装在你喜欢的位置，且安装时不需要额外勾选任何选项。
你一安装完毕，在新建的终端中输入命令

npm

如果没有提示

'npm' 不是内部或外部命令，也不是可运行的程序
或批处理文件。

则代表你已经成功安装。

安装 Hexo

在终端输入命令

# 如果你是在 Linux 下进行安装，该文件会被安装到 root 目录下，因此可能需要你使用 sudo 提权
npm install hexo-cli -g

之后，创建一个名为 blog 的文件夹，并初始化为博客仓库

mkdir blog
cd blog
hexo init

需要注意的是，如果你在安装 Hexo 时执行的命令是

npm install hexo

将意味着你仅局部安装 Hexo 包，请以

npx hexo init

代替

hexo init

安装主题

在终端中接着输入

npm install hexo-theme-redefine@latest

这样就可以安装 Redefine 主题到本地。
接着在 blog 文件夹里打开 _config.yml 并找到如下一行

theme: landscape

此处是你的博客所使用的主题，由于官方主题并不好看，我这里将以 Redefine 代替

theme: Redefine

大部分主题的配置文件应当相似，且部署步骤的差异应当很小，因此你可以自行替换为你想要的主题，但请在部署前仔细阅读主题文档，确保没有关于网页部署的特别要求。

配置主题

如果你使用的是 Redefine 主题，请参考他们的官方文档进行修改，注意该主题有 v1 和 v2 两个版本，当你发现你的配置文件无法和官方文档对上时，请检查你的 Redefine 主题版本号是否和当前阅读的文档一致。此处不赘述配置过程。

推送到 GitHub

在你的 GitHub 上新建一个仓库，不限制仓库可见性，你可以将其设置为 Private 仓库；仓库名字不限。
部署的方法有很多，此处使用最简单的 hexo-deployer-git 方法。
首先安装 hexo-deployer-git 插件。

npm install hexo-deployer-git

完成后，打开 _config.yml 并在文件尾部追加下列配置项（如果该配置项已在 _config.yml 中存在，请直接将相关项替换即可）。

deploy:
  type: git
  repo: https://github.com/<username>/<project>
  # repo 填的是你要推送的仓库地址，例如
  # https://github.com/b1u3/blogstorage.git
  # 除了 HTTPS 还支持 SSH 地址
  # [email protected]:b1u3/blogstorage.git
  # 额外声明：以上地址为本人虚构，如能推送，纯属巧合
  branch: main
  # 推送的分支，稍后会再提

这将推送到 main 分支上，同样的，不强制要求你必须把成品推送至此分支。

提示

请不要直接通过 Git 将你的源文件推送至仓库，否则你将会把一堆需要进行构建的源文件推送到仓库，在 Cloudflare Pages 自动抓取后还需要耗费大量时间从零构建，极其耗费时间。

在推送更改之前，请至少先检查网站是否正常工作，执行

hexo s

并通过 localhost:4000 检查你的网站是否正确显示。一旦确认无误，在 PowerShell 终端中执行

hexo clean; hexo d -g

你的网站就会先构建并在随后推送至你相应的 GitHub 仓库。

配置 Cloudflare Pages

前往 Cloudflare 登录你的账号（如果没有，请直接注册），在左侧边栏找到 Workers 和 Pages

点击“连接到 Git”

如果这是你第一次使用，Cloudflare 会要求获得你的 GitHub 账号授权，建议勾选上“All Repository”选项，确保将来构建的仓库也可以被 Cloudflare Pages 抓取。接着，找到你先前推送的仓库，选择它。此处，我先前推送的仓库是 blog，则此处选择 blog。

之后给你的项目进行设定，项目名称自拟，生产分支选择先前我们所推送到的分支，也就是我们先前在 _config.yml 中为 branch 设定的参数，如果不记得了就回头看一下吧。
一般来说我们要在“框架预设”中，设定你所使用的框架，但是由于某些原因，Cloudflare Pages 移除了对 Hexo 的支持，导致你现在无法在这里选择到 Hexo，不过没关系，由于我们推送的是已经构建好的网页文件，因此移除与否均不会影响我们使用，在“构建命令”中填入

exit 0

随后就可以直接开始构建。

构建完成后，我们可以为项目指定自己的域名。此处点击“设置自定义域”。

输入自己的域名。

由于我的域名是在 Cloudflare 上购买的，并且没有迁出该域名，因此可以直接在这一步骤中自动调整 DNS 设置。如果你使用的是其他的服务商提供的域名，那么就在相应的服务商网站按照下面的图片更改即可。

点击“激活域”之后，等待 DNS 检查完成，检查步骤不是立即完成，而是需要一定时间才能生效，如果你在其他服务商那里设置的域名 DNS 设置，可能时间会更长一点，请耐心等待。

到这一步你的部署也就完成了，如果你的文章有修改的需要，只需要每次重新执行