利用 Cloudflare + GitHub 部署 Hexo 博客

在这篇文章中，我将分享如何通过 Cloudflare Pages 和 GitHub 来部署 Hexo 博客。我们将在本地创建并维护博客内容，生成静态文件，然后通过 GitHub 进行版本控制，最后由 Cloudflare Pages 来托管和展示博客；核心思路：本地部署hexo博客，然后文件提交给GitHub，然后发布到cloudflare pages中，不需要自己购买服务器、只需要准备一个域名，博客也不需要进行后台管理，本地修改之后可以直接同步发布到网页。

1. 准备工作

1.1 安装 Hexo

首先，在本地计算机上安装 Hexo。你需要确保已经安装了 Node.js 和 npm。

1	npm install -g hexo-cli

1.2 初始化 Hexo 项目

选择一个目录来初始化你的 Hexo 项目：

1
2
3

hexo init my-blog
cd my-blog
npm install

1.3 创建 GitHub 私有仓库

在 GitHub 上创建一个新的私有仓库，用于存放 Hexo 生成的静态文件和配置。你可以将其命名为 my-blog 或任何你喜欢的名字。

2. 本地创建和部署 Hexo 博客

2.1 编写博客文章

在本地 Hexo 项目中创建新的文章：

1	hexo new "我的第一篇文章"

在 source/_posts 目录下，你可以找到生成的 Markdown 文件，编辑这个文件以撰写你的文章。

2.2 生成静态文件

在完成文章的编写后，运行以下命令生成静态文件：

1	hexo generate

生成的静态文件会存放在 public/ 目录下。

2.3 提交到 GitHub

将生成的静态文件和 Hexo 配置提交到你创建的 GitHub 私有仓库中：

git init
git remote add origin [email protected]:yourusername/my-blog.git
git add .
git commit -m "Initial commit"
git branch -M main
git push -u origin main

3. 使用 Cloudflare Pages 部署博客

3.1 创建 Cloudflare Pages 项目

3.2 配置项目设置

在项目设置中，指定以下配置：

构建命令: npm run build 或 hexo generate
输出目录: public

Cloudflare Pages 会自动拉取 GitHub 仓库中的代码，执行构建命令，并将 public 目录中的内容部署为静态网站。

3.3 部署和访问

Cloudflare Pages 会在你提交代码后自动进行部署。完成部署后，你会得到一个唯一的 URL 来访问你的博客。

4. 本地操作与自动更新

4.1 本地修改与提交

每次在本地修改或新增文章后，生成静态文件并提交到 GitHub：

hexo generate
git add .
git commit -m "Update post"
git push origin main

4.2 自动更新

Cloudflare Pages 会自动检测 GitHub 仓库中的更新，并重新部署网站。你只需在本地操作，提交更新，博客内容就会自动同步到线上。

结语

通过利用 Hexo、GitHub 和 Cloudflare Pages，你可以轻松地在本地创建、修改和维护博客，并且所有的部署和展示过程都是自动化的。这种方式不仅高效，还能够确保你的博客内容私密且易于管理。

GitHub+cloudflare pages 部署hexo bolog 步骤