🚀 Hexo 博客部署到 GitHub + Cloudflare Pages 完整指南

🎬 视频教程

⚠️ 小提示：

  • 🐢 Node.js、Git 安装包官方下载可能较慢，建议使用代理加速下载，或前往本站云盘获取安装包

  • 🛡️ GitHub 国内访问可能不稳定，建议全程使用代理网络进行部署

  • 🛰 推荐自用机场（稳定高效）👉 注册传送

    • 🧧 九折优惠码：like10

1. 安装依赖环境

✅ 安装 Node.js

建议安装稳定版（LTS）版本：Node.js 官网

✅ 安装 Git

下载地址：Git 官网

💡 提示：安装 Git 时，在选择主干分支名称（default branch name）阶段，建议将默认的 master 修改为 main，以便后续与 GitHub 主流仓库命名保持一致。

🔎 为什么推荐使用 main？

  • GitHub 目前新建仓库默认使用 main 作为主分支名称；

  • 可避免后续部署、协作时出现分支不一致的问题；

  • 体现现代化命名规范，master 逐步被淘汰；

  • 早期 master/slave 的术语来源含有种族主义争议，许多社区已弃用。

2. 安装 Hexo CLI

1
npm install -g hexo-cli

⚠️ 如遇 npm 版本过低提示：，运行命令安装最新版本

1
npm install -g npm@latest

3. 初始化 Hexo 项目

1
2
3
4
mkdir hexo
cd hexo
hexo init
npm install

🔍 启动本地服务器查看效果

1
hexo server

在浏览器访问 http://localhost:4000

4. 初始化 Git 仓库并提交代码

🛠 先设置 Git 用户信息

1
2
git config --global user.name "你的名字"
git config --global user.email "你的邮箱"

确认设置成功：

1
git config --global --list

初始化仓库

1
2
3
git init
git add .
git commit -m "Initial commit"

5. 推送代码到 GitHub

1️⃣ 登录 GitHub 手动创建一个新仓库

  1. 登录 GitHub，点击页面右上角的 + 按钮，选择 New repository（新建仓库）。
  2. 在 Repository name（仓库名称）框中，填写你的仓库名称（例如：hexo）。
  3. 在 Description（可选描述）框中，可以添加仓库的简短描述（如：“我的 Hexo 博客”）。
  4. 选择 Public（公开）或 Private（私有），通常选择 Public 让其他人也可以访问你的仓库。
  5. 其他设置可以保持默认即可，点击 Create repository（创建仓库）按钮。

2️⃣ 添加远程地址并推送代码

  1. 创建仓库后，GitHub 会显示仓库的主页，找到并复制仓库地址，形如：

    1
    https://github.com/your-username/hexo.git

  2. 在终端中，执行以下命令将你的 Hexo 项目推送到 GitHub：

    1
    2
    3
    git remote add origin https://github.com/your-username/hexo.git
    git branch -M main  # 若默认是 master，可改为 main
    git push -u origin main
    • 其中，your-username 是你的 GitHub 用户名，hexo 是你的仓库名称。
    • 如果 GitHub 提示需要验证你的 GitHub 账号，可以通过输入用户名和个人访问令牌（Token）进行认证。

⚠️ 如果安装 Git 时已设置默认为 main 分支，可省略重命名操作

6. 使用 Cloudflare Pages 自动部署

📌 创建 Pages 项目

  1. 登录 Cloudflare 后台 → 选择 Pages
  2. 点击 创建项目
  3. 连接 GitHub，选择所有仓库或指定仓库授权
  4. 授权成功后，选择你的 Hexo 仓库开始配置

🛠 构建设置

  • 构建命令
1
npx hexo generate
  • 发布目录
1
public
  • 框架预设：选 None

✨ 构建完成

Cloudflare 构建成功后，会自动生成一个 .pages.dev 域名用于预览

7. 配置自定义域名（可选）

☁️ 自动解析 (限定顶级域名托管于 Cloudflare)

  1. 点击 “设置自定义域名”
  2. 输入你的域名，Cloudflare 会自动生成 DNS 解析
  3. 等待几分钟，域名生效

✋ 手动解析（域名未托管CF或为子域名）

  1. 选择“我将手动添加 DNS 记录”
  2. 根据提示，到域名 DNS 服务商处添加 CNAME 记录
  3. 点击“检查 DNS 记录”，等待解析生效

✅ 总结

阶段 工具 作用
内容生成 Hexo 本地 Markdown 编写，生成静态网站
版本管理 Git + GitHub 仓库托管，触发 Cloudflare 构建
网站托管 Cloudflare Pages 自动构建 + CDN + HTTPS