仅使用iPad从0搭建hexo个人blog建站

0.1 准备食材#

• 一台有良好网络环境的 iPad
• GitHub 账号

0.2 什么是 codespace#

GitHub Codespaces 是 GitHub 提供的一种基于云的开发环境，允许您直接在浏览器中使用完整的 vsc 体验，无需在本地安装任何开发工具。这意味着我们可以在任意联网且可使用浏览器的环境中完成开发工作，不依赖本地物理设备，非常适合 iPad 等移动设备使用

1.1 在 GitHub 登录并创建 repo#

打开GitHub，登录您的账号，点击右上角的 +，选择New repository，填写仓库名称（例如：hexo-blog），类型建议选私密 repo，勾选add a README file，点击Create repository完成创建。

1.2 创建 Codespace#

在刚创建的 repo 页面，点击Code按钮，选择Codespaces选项卡，点击Create codespace on main，等待 codespace 创建完成。随后会在浏览器中打开 VSCode，在此页面我们可以进行 blog 搭建工作。

1.3 安装 Hexo#

在 codespace 的终端中，输入以下命令安装 pnpm：

1
npm install -g pnpm

随后安装 Hexo：

1
pnpm install hexo-cli

1.4 初始化 Hexo#

在终端中，输入以下命令初始化 Hexo：

1
pnpm dlx hexo init tmp

由于 hexo 是在子目录 tmp 中创建的，我们需要进入该目录，将初始化产物迁移出来

1
cd tmp
2
mv * .[^.]* ..
3
cd ..
4
rm -rf tmp

这样 tmp 的临时目录就成功迁移出来了

pnpm 默认不允许脚本，我们需要使用以下命令允许构建

1
pnpm approve-builds

输入后，会出现命令行选项，我们输入a，再输入y并回车，允许所有脚本构建，会自动完成其余构建

1.5 启动 hexo#

在终端中，输入以下命令启动 hexo：

1
pnpm hexo s

随后会自动启动开发服务器，我们点击在浏览器中打开，即可在新标签页中预览 hexo blog，按 ctrl+c 可以停止服务器

1.6 进行初次 commit#

打开终端，输入以下命令进行初次 commit：

1
git add .
2
git commit -m "Initial commit"
3
git push -u origin

之后的提交也可以通过左侧的 Source Control 图标进行推送

TIP

为什么要提交 commit？
在 codespaces 中，约等于一个临时环境，commit 的操作就像您点了一次保存，同时该保存会记录在 git 历史中，随时可以查看 / 回滚

2.1 创建新的 blog 文章#

在终端中，输入以下命令创建新的 blog 文章：

1
pnpm hexo new "文章标题"

随后会在source/_posts目录下生成一个新的 markdown 文件，打开此文件编辑即可

2.2 更换主题#

您可以在 hexo 的主题库中选择喜欢的主题，按照主题的安装说明进行安装和配置，这里以 hexo redefine 主题为例：

1
git submodule add https://github.com/EvanNotFound/hexo-theme-redefine themes/redefine

随后打开_config.yml，找到theme字段，修改为redefine，保存即可

2.3 配置#

打开_config.yml， 这里可以定义最基本的信息，如站点标题、描述、作者信息等，您可以根据需要进行修改，主题配置一般需要额外配置，请参考您使用的主题的 README 进行配置

3.1 登录 cloudflare dashboard#

打开Cloudflare Dashboard，登录账号，打开左侧面板，点击计算和 AI，点击创建新的应用程序，选择从 git 仓库部署，选择刚才创建的 hexo-blog 仓库即可

3.2 构建配置#

• 框架预设：（留空）
• 构建命令：pnpm hexo generate
• 输出目录：public

点击保存并部署站点，稍等片刻即可完成部署

3.3 访问站点#

cloudflare 默认会给出一个 dev 域名访问，您也可以 CNAME 绑定自己的域名