Hugo 博客部署全流程：小白也能看懂的上线教程

🚀 部署前准备

你需要准备的东西

• ✅ 一台电脑
• ✅ 一个 GitHub 账号
• ✅ 一个 Cloudflare 账号
• ✅ 你的博客代码（本地写好的 Hugo 项目）

安装 Git

1. 访问 git-scm.com 下载安装
2. 一路点"下一步"完成
3. 打开终端输入 git --version，能看到版本号就说明安装成功了

📦 第一步：把代码推到 GitHub

1. 创建 GitHub 仓库

1. 打开 github.com，登录你的账号
2. 点击右上角的 + 号，选择 New repository
3. 填写仓库信息：
   • Repository name：Hugo-blog（填你喜欢的名字）
   • Visibility：选择 Public（公开）
   • 不要勾选其他任何选项
4. 点击 Create repository

2. 创建 .gitignore

在博客根目录创建 .gitignore 文件，内容：

public/
.hugo_build.lock
.DS_Store
resources/

public/ 是 Hugo 构建生成的目录，不要提交到 Git，Cloudflare 会自动构建生成它。

3. 初始化 Git 并推送

打开终端（推荐 Git Bash），进入博客目录：

# 进入博客目录
cd /e/boke-ahxin

# 初始化 Git
git init

# 添加所有文件
git add .

# 提交
git commit -m "Initial commit"

# 关联远程仓库（用户名和仓库名改成你自己的）
git remote add origin https://github.com/anxinweb/Hugo-blog.git

# 推送到 GitHub
git push -u origin master

⚠️ 如果推送时提示 Failed to connect to github.com:443，说明网络连不上 GitHub，需要配置代理：

git config --global http.proxy http://127.0.0.1:7890
git config --global https.proxy http://127.0.0.1:7890

端口号改成你代理工具的端口。

推送成功后，GitHub 仓库里应该能看到这些文件和目录：

archetypes/ content/ static/ themes/PaperMod/ .gitignore hugo.toml

❗ static/ 目录必须推上去，里面包含头像、图标和 CMS 配置文件。

☁️ 第二步：部署到 Cloudflare Pages

1. 登录 Cloudflare

打开 dash.cloudflare.com，注册或登录

2. 创建 Pages 项目

1. 左侧菜单点击 Workers 和 Pages
2. 点击 概述
3. 点击 创建 按钮
4. 选择 Pages 标签（注意：是 Pages，不是 Workers）
5. 点击 连接到 Git
6. 授权 Cloudflare 访问你的 GitHub 仓库
7. 在仓库列表中找到你的博客仓库，点击 开始设置

3. 配置构建设置

展开 环境变量（高级），点击 添加变量：

4. 开始部署

点击 保存并部署，等待几分钟。

部署成功后会出现 Success 标志，并显示网站地址：

https://你的项目名.pages.dev

5. 配置自定义域名

1. 在 Pages 项目中点击 自定义域 标签
2. 点击 设置自定义域
3. 输入你的域名（如 boke.ahxin.cn）
4. 点击 继续
5. Cloudflare 会添加 DNS 记录，完成配置

自定义域名需要先确保你的域名已经在 Cloudflare 上管理。

📝 在 GitHub 上直接发文（不用 CMS）

如果你觉得 Decap CMS 用不了（国内访问 CDN 可能白屏），可以直接在 GitHub 网页上发文，零配置，手机电脑都能用。

发文步骤

1. 打开你的 GitHub 仓库，进入 content/posts/ 目录
2. 点击 Add file → Create new file
3. 文件名：文章标题.md
4. 填写文章内容，格式如下：

---
title: "今天去爬山了"
date: 2026-07-11
draft: false
summary: "记录一下爬山的过程"
---

今天天气很好，和朋友一起去爬了梧桐山...

5. 点击 Commit changes

Cloudflare 会自动检测到更新并重新构建部署，等一两分钟网站就刷新了。

文章格式说明

每篇文章开头必须有这一段：

• title：文章标题，显示在页面顶部
• date：发布日期
• draft：填 false（填 true 的话不会显示）
• summary：文章列表里显示的简介（可以不写）

🔧 常见问题

Q1：Cloudflare 部署失败

• 检查 HUGO_VERSION 环境变量是否设置为 0.164.0
• 检查 GitHub 仓库是否包含 themes/PaperMod/ 主题文件
• 检查 hugo.toml 有没有语法错误

Q2：git push 连不上 GitHub

配置代理后重试：

git config --global http.proxy http://127.0.0.1:7890
git config --global https.proxy http://127.0.0.1:7890

Q3：想换电脑

git clone https://github.com/你的用户名/你的仓库名.git
cd 仓库名
hugo server -D

Q4：文章提交后网站没更新

等待 1-2 分钟，Cloudflare 构建需要时间。可以到 Cloudflare 的 Pages 项目里查看 部署 状态。

💰 成本总结

总计：0 元（或 20-50 元/年）