我想搭建一个私有博客,本地编辑 Markdown,git 提交后自动更新,代码托管到 GitHub + Vercel。
结论先行:推荐 Hugo —— 它单文件安装、零依赖、构建极快,和你"本地 Markdown + git 推送 + 自动部署"的工作流匹配度最高;如果想要更现代的前端定制能力,备选 Astro。
一、为什么选 Hugo(对比)
| 维度 | Hugo(推荐) | Astro(备选) | Hexo |
|---|---|---|---|
| 底层 | Go,单二进制,无运行时依赖 | Node.js 前端框架 | Node.js |
| 构建速度 | 最快:实测 1 万页约 2.95 秒 | 快,构建期零 JS 输出 | 较慢:1000 页约 45 秒 |
| 上手门槛 | 低(装一个程序即可) | 中(需前端基础) | 低,中文资料最多 |
| 主题生态 | 丰富(PaperMod、Stack、DoIt 等) | 增长快 | 丰富但维护热度下降 |
| 适合人群 | 文章多、技术向、追求极简工作流 | 想深度定制 UI 的前端开发者 | 新手、纯中文生态偏好 |
选 Hugo 的核心理由:你的需求是"本地写 Markdown → git 提交 → 自动更新",Hugo 不需要任何构建环境(不用装 Node),Vercel 上一条命令搞定,日常维护成本最低。
二、整体架构
每次 git push 后,Vercel 自动拉取代码、执行构建、发布到 CDN,全程无需手动上传:
本地编辑 Markdown → git commit / push → GitHub 仓库
│
▼
Vercel 自动拉取并构建(hugo)
│
▼
发布到 CDN → https://xxx.vercel.app
三、详细搭建步骤(Hugo 主线)
第 1 步:本地安装 Hugo
- Windows:
winget install Hugo.Hugo.Extended(或去 GitHub Releases 下载hugo_extended_*_windows-amd64.zip,解压后把目录加进 PATH) - macOS:
brew install hugo - 验证:
hugo version
第 2 步:初始化站点并选主题
hugo new site myblog # 创建站点骨架
cd myblog
git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod # 下载主题(以 PaperMod 为例)
编辑 hugo.toml,启用主题并写基本信息:
baseURL = "https://你的vercel域名.vercel.app/" # 部署拿到域名后回填,也可先留默认
languageCode = "zh-cn"
title = "我的博客"
theme = "PaperMod"
第 3 步:写第一篇文章并本地预览
hugo new posts/hello.md # 创建文章,正文是标准 Markdown
hugo server -D # 本地预览,浏览器打开 http://localhost:1313
文章头部有 front matter,记得把 draft: true 删掉或改 false,否则发布时不会输出。
第 4 步:Git 初始化并推送 GitHub
echo "/public/" > .gitignore # 构建产物不入库
git init
git add . && git commit -m "init blog"
git branch -M main
git remote add origin https://github.com/你的用户名/仓库名.git
git push -u origin main
GitHub 上先建一个空仓库(不勾选 README,避免和本地冲突);仓库建 private 也没问题,Vercel 授权后照样能部署。
第 5 步:接入 Vercel 自动部署
- 打开 vercel.com,用 GitHub 账号登录(授权时会要求安装 Vercel GitHub App,勾选允许访问你的博客仓库)
- Add New → Project → Import 选刚才的仓库
- Framework Preset 选 Hugo(Vercel 会自动识别);确认 Build Command 为
hugo、Output Directory 为public - 点 Deploy,一两分钟后访问生成的
https://xxx.vercel.app即可
之后每次 git push 都会自动触发重新构建,只需导入一次。
第 6 步:日常更新流程(之后每天都一样)
hugo new posts/新文章.md # 写 Markdown
git add . && git commit -m "add: 新文章" && git push
推完等 1~2 分钟,Vercel 自动部署完成,这就是"git 提交后自动更新"的全部日常。
四、几点提醒
- “私有博客"的含义:Vercel 部署出的站点是公开可访问的(知道链接即可访问)。如果指"私人内容”,需要额外加访问控制(如部署后前端加密码页或 Basic Auth);如果只是"个人专属的公开博客",现在的方案就够了。
- 国内访问:Vercel 默认域名在国内一般可访问但速度一般,GitHub push 偶有波动。介意的话可以:绑定自己的域名(Vercel → Settings → Domains),或改用 Cloudflare Pages(步骤几乎一致)。
- 想选 Astro:安装 Node.js 后
npm create astro@latest,用官方博客模板(含 Content Collections),Vercel 会识别 Astro 框架,其余流程完全相同。