🚀 Windows部署博客

总览：要安装 3 个软件，按顺序来

  1. ✅ Git（版本控制）
  2. ✅ VS Code（写文章用的编辑器）
  3. ✅ Hugo（博客框架） 总共下载安装不超过 10 分钟！

🔧 第一步：安装 Git（第一个软件）

1. 下载

打开浏览器，复制这个地址：

https://git-scm.com/download/win

点击 Click here to download 自动下载

2. 安装

双击下载的 Git-2.xx.x-64-bit.exe

每一页按下面选，其他全部默认 Next：

安装页面选择
✅ 选择编辑器👉 下拉选 Use Visual Studio Code as Git’s default editor
✅ 其他所有页面直接点 Next
✅ 最后一页点 Install

3. 验证安装成功

按 Win + R → 输入 cmd → 回车，输入：

git --version

✅ 显示 git version 2.xx.x.windows.1 就对了！

🔧 第二步：安装 VS Code（第二个软件）

1. 下载

打开：

https://code.visualstudio.com/

点击 Download for Windows

2. 安装

双击安装包，全部打勾！：

  • ✅ 添加到 PATH（最重要！）
  • ✅ 创建桌面快捷方式
  • ✅ 右键菜单"通过 Code 打开"
  • ✅ 其他全部勾选

点击安装，完成后启动 VS Code

🔧 第三步：安装 Hugo（第三个软件）

1. 打开 Windows 终端

按 Win + X → 选 终端(管理员) 或 Windows PowerShell(管理员)

2. 执行安装命令（复制粘贴）

winget install Hugo.Hugo.Extended

3. 验证安装

关闭终端，重新打开一个，输入：

hugo version

✅ 显示 hugo v0.147.xxxx+extended 就对了！

🔐 第四步：注册 GitHub 并创建私有仓库

1. 注册 GitHub 账号（已有就跳过）

打开：https://github.com/signup

  • 输入邮箱
  • 设置密码
  • 设置用户名（这个就是你的 GitHub 账号）
  • 完成验证

2. 创建私有仓库（核心步骤）

  1. 登录后，点击右上角 + 号
  2. 点击 New repository
  3. 按下面填：
    • Repository name：my-blog（就写这个，别改）
    • ✅ Private（一定要选私有！）
    • ❌ 不要勾选 Add a README
    • ❌ 不要勾选 Add .gitignore
    • ❌ 不要勾选 Choose a license
  4. 点击绿色按钮 Create repository

✅ 现在你看到一个空仓库页面，不要关！后面要用

🔑 第五步：创建 GitHub 访问令牌（必做！）

Windows 不能用密码登录 Git，必须用 Token：

  1. GitHub 点击右上角你的头像 → Settings
  2. 拉到最左边最下面 → Developer settings
  3. 左边点击 Personal access tokens → Tokens (classic)
  4. 点击 Generate new token → Generate new token (classic)
  5. 按下面填：
    • Note：Windows Git（随便写）
    • Expiration：下拉选 No expiration（永不过期）
    • ✅ 勾选第一个大框 repo（只勾这个就行）
  6. 拉到最下面，点击绿色 Generate token

📌 重要！把生成的那串字母复制下来，保存到记事本！只显示一次！

长得像：ghp_xxxxxxxxxxxxxxxxxxxxxxxxxxxx

📂 第六步：本地创建博客文件夹

1. 在 D 盘新建文件夹

打开「此电脑」→ D 盘 → 右键新建文件夹 → 命名 MyBlog

2. 进入文件夹，右键 → Git Bash Here

（如果没有这个选项，就从开始菜单打开 Git Bash，然后输入 cd /d/MyBlog）

3. 配置 Git 身份（只做一次）

在 Git Bash 里输入（换成你自己的）：

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

🚀 第七步：初始化博客并推送到 GitHub

在 Git Bash 里，逐行复制执行：

# 1. 初始化 Git
git init

# 2. 关联你的私有仓库（换成你的用户名）
git remote add origin https://github.com/你的用户名/my-blog.git

# 3. 创建 Hugo 博客
hugo new site . --force

# 4. 安装 PaperMod 主题
git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod

# 5. 编辑hugo.toml
baseURL="https://your-blog-ejn.pages.dev"
languageCode="zh-cn"
title="your的技术博客"
theme="PaperMod"

# 6. 创建忽略文件
echo "public/" >> .gitignore
echo "resources/" >> .gitignore
echo ".hugo_build.lock" >> .gitignore

# 7. 第一次提交
git add .
git commit -m "初始化博客"

# 8. 推送到 GitHub（这一步要输入用户名和 token）
git push -u origin main

⚠️ 输入密码的时候，粘贴你刚才保存的 token！不是 GitHub 密码！

✅ 执行完，去 GitHub 刷新，看到代码就成功了！

☁️ 第八步：Cloudflare 部署

1. 注册 Cloudflare

打开：https://dash.cloudflare.com/signup 用邮箱注册，免费的

2. 创建 Pages 项目

  1. 左边点击 Workers & Pages
  2. 点击 Pages 标签 → Create a project
  3. 点击 Connect to Git
  4. 选 GitHub，登录并授权 Cloudflare 访问你的私有仓库
  5. 选择你的 my-blog 仓库 → Begin setup

3. 构建配置（一个字都别错）

配置项值
Project namemy-awesome-blog（随便）
Production branchmain
Framework preset✅ 下拉选 Hugo
Build commandhugo --minify
Build output directorypublic

4. 添加环境变量

点击 Environment variables (advanced) → Add variable：

  • 变量名：HUGO_VERSION
  • 值：0.147.0

5. 点击 Save and Deploy

🎉 等待 30 秒，部署完成！

🌐 第九步：访问你的博客！

部署成功后，你会得到一个域名：

https://my-awesome-blog.pages.dev

打开这个地址，你的博客已经上线了！

✍️ 第十步：日常写文章流程（以后每次就这么做）

方式一：VS Code 写（推荐）

  1. 打开 VS Code → 文件 → 打开文件夹 → 选 D:\MyBlog

  2. 按 `Ctrl + `` 打开终端

  3. 新建文章：

    hugo new posts/我的第一篇文章.md

  4. 左边找到 content/posts/我的第一篇文章.md，点击打开写

  5. 本地预览：

    hugo server -D

    浏览器打开 http://localhost:1313 看效果

  6. 写完发布：

    • 取消文章标头的draft: true，检查发布时间date

      💡 draft: true 是草稿，只有本地 hugo server -D 能看到，部署后不显示！ 💡 如果日期写的是明天或以后，Hugo 默认不显示！

    • 左边点 源代码管理 图标（Ctrl+Shift+G）
    • 写消息：新增：我的第一篇文章
    • 点击 ✓ 提交
    • 点击 ↓↑ 同步更改

✅ 1 分钟后，博客自动更新！

📋 检查清单（全部打勾就大功告成）

  • Git 安装成功
  • VS Code 安装成功
  • Hugo 安装成功
  • GitHub 私有仓库创建
  • Personal Access Token 创建并保存
  • 博客初始化推送到 GitHub
  • Cloudflare Pages 部署成功
  • 能访问 xxx.pages.dev
  • 能本地预览写文章