第一期：零基础快速搭建个人博客：Hexo + GitHub Pages + Cloudflare Pages 全流程指南，免费部署超详细教程！

1. 前期准备工作

2.1 安装 Node

从 Node 官网 下载适合自己系统的版本。

完成安装，Windows电脑建议使用默认目录 C:/Program Files/nodejs/，苹果电脑无所谓。

验证安装成功，在命令行中输入以下命令检查版本信息：

1
node -v

苹果用户可通过右键文件夹，选择“服务”，新建终端窗口以便操作。

2.2 安装 Git

从 Git 官网 下载适配的 Git 版本。

Windows 用户可使用默认目录安装 Git，Mac 用户则按提示在终端操作。

验证安装完毕后，Windows 用户会在开始菜单中看到 Git Bash 等应用。

3. 配置 Git 密钥并连接至 GitHub

3.1 配置用户名和邮箱

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

通过以下命令验证是否成功：

1
git config -l

3.2 配置公钥连接 GitHub

生成 SSH 公钥：

1
ssh-keygen -t rsa -C "你的邮箱"

一路回车生成密钥，进入 .ssh 文件夹复制 id_rsa.pub 公钥内容，配置到 GitHub 的 SSH 设置中。

苹果电脑操作：

  • 打开 Finder。
  • 按下 Command + Shift + G，在弹出的对话框中输入文件路径，然后按 Enter。

Windows 电脑操作：

  • 打开 C 盘下用户文件夹下的 .ssh 文件夹。
  • 会看到以下文件：
    • id_rsa（私钥）
    • id_rsa.pub（公钥）
  • 找到公钥，并复制，打开 GitHub 开始配置。

将 SSH KEY 配置到 GitHub：

  1. 进入 GitHub，点击右上角头像，选择 Settings。
  2. 进入设置页后选择 SSH and GPG keys。
  3. 名字随便起，公钥填到 Key 那一栏。

测试连接：

1
ssh -T [email protected]

第一次连接会提示 Are you sure you want to continue connecting (yes/no/[fingerprint])?，输入 yes 即可。

3.3 创建 GitHub.io 仓库

  1. 点击右上角的 + 按钮，选择新建仓库。
  2. 命名格式为 <用户名>.github.io（注意：前缀必须为用户名），选择公开 Public。
  3. 点击 Create repository 进行创建。

4. 初始化 Hexo 博客

创建文件夹保存博客源码

  • 苹果用户：随意创建好文件夹后，在文件夹右击，选择“服务”选择“新建终端窗口以便操作”。
  • Windows 用户：可以（例如 D:/Hexo-Blog），在该文件夹内启动 Git Bash 或终端。

安装 Hexo

1
npm install -g hexo-cli && hexo -v

出现版本信息代表安装成功。

初始化 Hexo 项目安装依赖

1
2
3
hexo init blog-demo
cd blog-demo
npm i

现在你的文件夹会有这些内容。

启动项目并验证

1
hexo cl && hexo s

在浏览器中访问 http://localhost:4000/ 以查看效果。

5. 将静态博客挂载到 GitHub Pages

修改 _config.yml 文件

配置 repository 为你的 GitHub 地址，分支改为 main：

1
2
3
4
deploy:
  type: git
  repository: [email protected]:你的用户名/你的用户名.github.io.git
  branch: main

安装 hexo-deployer-git

1
npm install hexo-deployer-git --save

部署到 GitHub

1
2
3
4
5
6
7
# Git BASH终端
hexo clean && hexo generate && hexo deploy  

# 或者

# VSCODE终端
hexo cl; hexo g; hexo d

访问 https://<用户名>.github.io/ 以查看博客。

6. 将静态博客挂载到 Cloudflare Pages

  1. 通过 Cloudflare Pages 连接 Git 仓库。
  2. 登录 GitHub，点击保存并部署。
  3. 部署成功后，访问 Cloudflare 提供的链接。

如有自定义域名，可以在 Cloudflare Pages 中绑定。没有建议去申请，这样博客就不被墙了。

如何使用

新建一篇博文

1
hexo new "这是一篇新的博文"

编辑文章

在 _posts 文件夹中编辑新建的文章，使用 Markdown 语法编写内容。

本地预览

1
hexo cl && hexo s

推送到 GitHub

1
hexo cl && hexo g && hexo d

我的网址收藏

  1. Google - 搜索引擎
  2. GitHub - 开源项目托管平台
  3. YouTube - 视频分享平台
  4. Stack Overflow - 程序员问答社区
  5. MDN Web Docs - Web开发文档

进阶教程预告

接下来会介绍 Hexo 主题美化、文章写作，赶紧订阅我吧！

解决 VSCODE 报错

如果首次执行 VSCODE 终端出现报错，可以使用管理员身份打开 PowerShell，并执行以下命令：

1
Set-ExecutionPolicy RemoteSigned