创建blog的过程

一、为什么选择”静态博客 + 不买服务器”

• 对比过静态博客（Hexo/Astro/Hugo）和动态博客（WordPress）：
  • 静态：访问时服务器只是把现成的 HTML 文件给你，快、安全、几乎零维护
  • 动态：每次访问都现查数据库现生成，需要服务器、要防攻击、要备份
• 对比过腾讯云/阿里云/京东云/华为云的服务器价格（2核2G 大约 38~99 元/年）
• 最终决定不买服务器。理由：
  1. 我的博客主要写文章，静态方案完全够用
  2. GitHub Pages 免费托管，一分钱不花
  3. 省去服务器维护、备案等麻烦

二、用到的技术栈

项目	内容
框架	Hexo 7.3.0（静态博客生成器）
主题	Fluid 1.9.9（现代简约风，支持暗色模式）
托管	GitHub Pages（免费）
写作	Markdown 纯文本
环境	Node.js v22 / npm 10 / Git 2.52（Windows）
项目位置	D:\A_DSH test\blog

三、搭建步骤时间线

1. 环境准备

• 安装/确认 Node.js、Git
• 检查版本：node -v、git --version

2. 初始化项目

npm install -g hexo-cli      # 安装 Hexo 脚手架
hexo init blog               # 创建博客项目（会自动安装依赖）
cd blog
hexo server                  # 本地预览 → http://localhost:4000

• 看到默认的 “Hello World” 页面 = 第一步成功

3. 个性化配置

• 改 _config.yml：站点标题”Cup(Empty)的装水笔记”、作者 HENY ZHAN、语言 zh-CN
• 删除示例文章 hello-world.md，放入自己的第一篇文章

4. 更换主题（Fluid）

npm install hexo-theme-fluid --save   # 安装主题
# 在 _config.yml 里把 theme 改成 fluid
# 新建 _config.fluid.yml 做主题自定义

• 重启 hexo server，看到全新的现代风格界面

5. 部署上线（最难的一关）

npm install hexo-deployer-git --save   # 部署插件
git config --global user.name "CupEmpty"
git config --global user.email "CupEmpty@users.noreply.github.com"

• 在 GitHub 网页创建空仓库 CupEmpty.github.io（必须这个名字）
• 生成访问令牌（Settings → Developer settings → Personal access tokens）
• 在 _config.yml 配置部署地址

hexo clean
hexo generate
hexo deploy

• 上线成功 → https://CupEmpty.github.io 🎉

6. 速度诊断

• 上线后发现加载慢
• 排查：网站本身只有 ~1MB（很轻），第三方库都在国内 CDN
• 结论：GitHub Pages 服务器在国外，国内访问 github.io 天然偏慢，属正常现象
• 未来可选项：备案 + 国内对象存储（COS/OSS）加速，或自定义域名 + Cloudflare

7. 样式折腾

• 自定义 CSS：source/css/custom.css（改主题色、特效等）
• 首页标语：_config.fluid.yml → index.slogan.text

四、踩坑记录（写作亮点素材！）

#	现象	原因	解决
1	npm install -g hexo -cli 好像装了什么	命令打错（多了空格）	重装为 hexo-cli，好在不影响
2	hexo init bolg 后 cd blog 找不到	单词拼错（bolg）	删掉重来，hexo init blog
3	'git' 不是内部或外部命令	Git 装了但不在系统路径	手动把 git 目录加入 PATH
4	hexo deploy 报 Spawn failed	终端窗口没加载新 PATH	新开终端窗口再部署
5	CRYPT_E_NO_REVOCATION_CHECK	Windows 证书吊销检查连不上	git config --global http.schannelCheckRevoke false
6	unable to get local issuer certificate	OpenSSL 找不到证书	git config --global http.sslBackend schannel
7	弹出 CredentialHelperSelector	选择登录方式	选 manager，浏览器授权登录
8	&& 报错”不是有效语句分隔符”	PowerShell 5.1 不支持	一条一条执行
9	首页横幅显示英文标语	主题默认文案优先	在 _config.fluid.yml 设置 index.slogan.text

心得：报错不可怕，关键是①看报错信息 ②找到对应环节 ③逐个击破。这些坑也是这篇博客最有价值的素材。

五、以后的写作流程（每篇都一样）

cd "D:\A_DSH test\blog"
hexo new "文章标题"                    # 新建
# 用 VS Code 编辑 source\_posts\文章标题.md
hexo server                           # 本地预览（可选）
hexo clean; hexo generate; hexo deploy  # 发布

六、站点文件结构（简单版）

blog/
├── _config.yml            # 站点主配置（标题、作者、语言、部署地址）
├── _config.fluid.yml      # 主题自定义配置（标语、页脚、custom_css）
├── source/
│   ├── _posts/            # 📝 所有文章放这里（.md 文件）
│   └── css/custom.css     # 🎨 自定义样式
└── public/                # 生成的网站文件（部署用，不用手动动）