2026-10-13

Hexo博客部署到CloudflarePages完整教程

================================================================================
Hexo 博客部署到 Cloudflare Pages 完整笔记（全量版）
================================================================================

目标：本地写 Markdown → 推到 GitHub → Cloudflare Pages 自动构建 → 用 readhaven567.top 访问
作者环境：Windows 11 / Node.js v24.15.0 / Git / GitHub / Cloudflare / GoDaddy
最后更新：2026-10-13
博客地址：https://readhaven567.top
GitHub 仓库：https://github.com/suvenG123/hexo-blog

================================================================================
一、需要的软件和账号

软件 / 平台作用下载地址

Node.js（LTS）运行 Hexo https://nodejs.org
Git 推送代码到 GitHub https://git-scm.com
Hexo-CLI 生成博客框架 npm 安装
GitHub 存放博客源码 https://github.com
Cloudflare 托管静态站 + CDN + SSL https://dash.cloudflare.com
GoDaddy 域名注册商（只改 NS） —

注意：不需要安装 hexo-deployer-git，也不需要 GitHub Pages。
走的是「Cloudflare Pages 拉 GitHub 源码自动构建」。

================================================================================
二、本地安装 Node.js 和 Git

安装 Node.js
- 去 nodejs.org 下载 LTS 版本（v24.15.0）
- 一路下一步安装
- 安装完打开终端验证：
  node -v
  npm -v
  能看到版本号 = 成功
安装 Git
- 去 git-scm.com 下载
- 安装时默认选项即可
- 验证：
  git –version
配置 Git 用户名（第一次必做）
git config –global user.name “你的GitHub用户名”
git config –global user.email “你的GitHub邮箱”

================================================================================
三、安装 Hexo 并初始化博客

全局安装 Hexo-CLI
npm install -g hexo-cli
验证：hexo -v
新建博客目录
D:
mkdir hexo-blog
cd hexo-blog
初始化 Hexo
hexo init
npm install
本地预览
hexo clean
hexo generate
hexo server
浏览器打开 http://localhost:4000

================================================================================
四、写文章

方式一：命令行新建（推荐）
hexo new “文章标题”
生成位置：source/_posts/文章标题.md

方式二：手动放文件
直接把写好的 .md 文件放进 source/_posts/ 文件夹。

⚠️ 文章格式注意事项（非常重要！）
每篇文章最顶部必须有 Front-matter 头信息，否则 Hexo 会报错（js-yaml 报错）并跳过渲染：

title: 文章标题
date: 2026-10-13 10:00:00
tags: [标签1, 标签2]
categories: 分类名

正文内容写在这里…

常见格式错误：

title: 后面没打空格（正确：title: 标题，错误：title:标题）
少了开头或结尾的 —
日期格式不对
文件名带 .md.md 双后缀

================================================================================
五、创建 GitHub 仓库

登录 GitHub → New repository
仓库名：hexo-blog
选 Public
不要勾 Add README
点 Create repository

================================================================================
六、推送代码到 GitHub

方式一：命令行
cd D:\hexo-blog
git init
git add .
git commit -m “初始化Hexo博客”
git branch -M main
git remote add origin https://github.com/suvenG123/hexo-blog.git
git push -u origin main

方式二：GitHub Desktop
1. 打开 GitHub Desktop → File → Add local repository → 选 D:\hexo-blog
2. 左侧 Changes 里勾选要提交的文件
（不要勾 node_modules/、public/、多余副本文件）
3. 底部输入 Summary（如”初始化Hexo博客”）
4. 点 Commit to main
5. 点顶部的 Push origin

⚠️ 只 Commit 不 Push = 代码只在本地，云端不会更新！

================================================================================
七、Cloudflare Pages 部署

登录 dash.cloudflare.com
Workers 和 Pages → 创建应用程序 → 选 Pages（不是 Worker！）
连接到 Git → 选 hexo-blog 仓库
构建设置：
- 项目名称：hexo-blog
- 生产分支：main
- 框架预设：无
- 构建命令：npx hexo generate
- 输出目录：public
- 根目录：留空
- 环境变量：NODE_VERSION = 24
保存并部署 → 等变绿 ✅

部署日志正常应该包含：

Installing dependencies…
Running build command…
Generated:（后面列出生成的文章）
Uploading…
Success!

================================================================================
八、GoDaddy 改 NS（接入 Cloudflare）

Cloudflare 添加站点 readhaven567.top → 拿到两个 NS 地址
去 GoDaddy → 域名 → DNS → Nameservers → Change
删掉原来的 ns63/ns64.domaincontrol.com
填 Cloudflare 给的两个 NS → Save
关闭 DNSSEC（重要！否则证书可能签发失败）
等状态从 Pending 变 Active（几分钟到 24 小时）

================================================================================
九、绑定自定义域名

Pages 项目 → 自定义域 → 设置域
输入 readhaven567.top → 确认
Cloudflare 自动添加 DNS 记录
等证书签发完，状态变 Active
访问 https://readhaven567.top

SSL 设置：
左侧 SSL/TLS → 加密模式选完全（Full）→ 开「始终使用 HTTPS」

================================================================================
十、修改 Hexo 的 url 配置

编辑 D:\hexo-blog_config.yml：
url: https://readhaven567.top
root: /

然后重新生成并推送：
hexo clean && hexo generate
git add . && git commit -m “绑定正式域名” && git push

================================================================================
十一、日常写文章流程

   hexo new "文章标题"
   # 用 VS Code 编辑 source/_posts/文章标题.md
   hexo clean && hexo generate
   git add .
   git commit -m "新文章：文章标题"
   git push

等 1-3 分钟 → Cloudflare 自动部署 → 刷新网页

⚠️ 不需要每次开 hexo server，除非你想本地预览。

================================================================================
十二、常见报错排查

问题原因解决

js-yaml 报错 / Cannot GET/ 文章 Front-matter 格式错误检查 title: 后是否有空格
检查 — 是否完整
部署红色失败构建命令没填或 Node 版本检查 npx hexo generate
不对和 NODE_VERSION=24
.pages.dev 能开域名打不开 NS 没生效或自定义域没绑等 NS 传播 / Pages 里绑
ERR_CONNECTION_CLOSED 域名绑到了 Worker 而不是去 Worker 解绑，在 Pages 绑
Pages
重定向次数过多 SSL 模式用了 Flexible 改成完全（Full）
手机能开电脑不能电脑 DNS 缓存旧了 ipconfig /flushdns
推送后网页没更新浏览器/CDN 缓存 Ctrl + F5 强刷
/ Cloudflare 清缓存
本地 hexo s 看不到新文章文章格式错误或文件放错检查 Front-matter
位置 / 确认在 _posts 里
GitHub Desktop 显示 0 文件已提交或未检测到变化点 Ctrl+R 刷新
changed files 检查文件是否在正确目录

================================================================================
十三、Cloudflare 缓存 vs 构建缓存

类型位置什么时候清

CDN 缓存域名 → 缓存 → 清除所有内容网页更新后看不到
构建缓存 Pages 项目 → Settings → 构建结果异常时
Build → Clear Cache

================================================================================
十四、最终架构图

本地 Hexo (D:\hexo-blog)
↓ git push
GitHub 仓库（源码）
↓ Cloudflare Pages 拉取
npx hexo generate → public/
↓
Cloudflare CDN
↓
readhaven567.top

================================================================================
十五、关键文件路径速查

文件 / 目录作用

source/_posts/ 所有文章放这里
_config.yml 博客主配置（url、title 等）
themes/ 主题目录
.gitignore 忽略 node_modules/、public/
package.json 依赖清单

================================================================================
十六、本次实战踩坑记录

❌ 文件名带 .md.md 双后缀
✅ 只用 hexo new “标题” 不加 .md
❌ 文章没写 Front-matter
✅ 顶部加 — + title: + date:
❌ 文件夹里有”副本.md”
✅ 删掉，避免重复渲染
❌ 域名绑到 Worker 导致 ERR_CONNECTION_CLOSED
✅ 解绑 Worker，在 Pages 绑
❌ SSL 用 Flexible 导致重定向循环
✅ 改 Full
❌ GitHub Desktop 只 Commit 没 Push
✅ 必须点 Push origin
❌ DNSSEC 没关
✅ GoDaddy 关闭 DNSSEC

================================================================================
十七、快速命令备忘

新建文章

hexo new “标题”

本地预览

hexo clean && hexo generate && hexo server

提交推送

git add .
git commit -m “说明”
git push

清 DNS 缓存

ipconfig /flushdns

查看 Git 状态

git status

================================================================================
—— 全文完 ——
================================================================================

================================================================================一、需要的软件和账号

软件 / 平台 作用 下载地址

================================================================================二、本地安装 Node.js 和 Git

================================================================================三、安装 Hexo 并初始化博客

================================================================================四、写文章

title: 文章标题 date: 2026-10-13 10:00:00 tags: [标签1, 标签2] categories: 分类名

================================================================================五、创建 GitHub 仓库

================================================================================六、推送代码到 GitHub

================================================================================七、Cloudflare Pages 部署

================================================================================八、GoDaddy 改 NS（接入 Cloudflare）

================================================================================九、绑定自定义域名

================================================================================十、修改 Hexo 的 url 配置

================================================================================十一、日常写文章流程

================================================================================十二、常见报错排查

问题 原因 解决

================================================================================十三、Cloudflare 缓存 vs 构建缓存

类型 位置 什么时候清

================================================================================十四、最终架构图

================================================================================十五、关键文件路径速查

文件 / 目录 作用

================================================================================十六、本次实战踩坑记录

================================================================================十七、快速命令备忘