静态博客部署到Cloudflare Pages的完整流程

无双博客 技术教程 20
<a href="https://wushuangbk.com/tags-342.html" title="静态博客" target="_blank" style="color: #4382FF;">静态博客</a><a href="https://wushuangbk.com/tags-456.html" title="部署" target="_blank" style="color: #4382FF;">部署</a>到Cloudflare Pages的完整流程 - 无双博客

静态博客部署到Cloudflare Pages的完整流程

2026年6月6日

之前我用Netlify部署博客,一直挺好的。

直到上个月,我发现构建时间越来越长,免费额度也快用完了(虽然还没超限,但心里不踏实...)

于是我开始研究其他平台,最后选了Cloudflare Pages

用下来感觉:真香!

免费额度大方、CDN速度快、部署简单。今天就把完整流程分享给你们。

为什么选Cloudflare Pages

我对比了几个平台:

  • Netlify:免费额度100GB流量/月,构建时间300分钟/月
  • Vercel:适合Next.js项目,但静态博客有点杀鸡用牛刀
  • GitHub Pages:免费,但自定义域名需要折腾,而且国内访问有时候抽风
  • Cloudflare Pages无限流量(真的!),免费额度够用,全球CDN

最关键的是——Cloudflare 的CDN节点多,国内访问速度也不错(当然比不上国内服务商,但比GitHub Pages强)。

准备工作

开始前,你需要:

  1. 一个 Cloudflare 账号(没有的话去 注册,免费)
  2. 博客源码已经在 GitHub 仓库里(没有的话赶紧推上去)
  3. 域名(可选,没有的话Cloudflare会提供默认子域名)

我假设你用的是 Hugo,其他静态生成器流程类似,只是构建命令不一样。

第一步:连接GitHub仓库

  1. 登录 Cloudflare Dashboard
  2. 左侧菜单找到 Pages,点击
  3. 点击 Create a project
  4. 选择 Connect to Git

然后会让你授权Cloudflare访问你的GitHub账号,同意就行。

选仓库的时候小心点,我第一次选错了,部署了半天发现是别人的仓库...(尴尬)

第二步:配置构建选项

这一步很关键!配置错了部署会失败。

对于Hugo项目,填写:

  • Project name:随便起,比如 my-blog
  • Production branch:一般是 mainmaster
  • Build commandhugo --minify
  • Build output directorypublic
  • Root directory:留空(除非你的博客在子目录里)
  • Environment variables:添加 HUGO_VERSION,值填你本地用的Hugo版本(比如 0.110.0

⚠️ 重点提醒:一定要设置 HUGO_VERSION!不然Cloudflare会用默认版本,可能跟你的本地版本不一样,导致构建失败。

我第一次没设置,构建日志里一堆报错,排查了半天才发现是版本问题...

第三步:等待部署

配置完点击 Save and Deploy,然后就等着吧。

一般几分钟就好了。如果失败了,点开构建日志看看哪里报错。

常见错误:

  • hugo: command not found:没设置 HUGO_VERSION
  • Error: failed to load config:配置文件有语法错误
  • theme not found:主题没加到Git仓库里(记得用 git submodule 添加主题)

第四步:绑定自定义域名(可选)

部署成功后,Cloudflare会给你一个默认域名:xxx.pages.dev

如果你想用自己域名,继续往下看:

  1. 在Pages项目里,点 Custom domains
  2. 点击 Set up a domain
  3. 输入你的域名(比如 blog.example.com
  4. Cloudflare会让你添加DNS记录,按提示操作就行

如果你的域名DNS已经在Cloudflare上了,会自动配置,超级方便。

如果不在Cloudflare上,需要去域名注册商那里改Nameserver(这个我就不细说了,每个注册商界面都不一样...)

第五步:开启HTTPS

好消息:Cloudflare Pages自动帮你开启HTTPS!

不用自己去申请证书,不用配置Nginx,什么都不用做。Cloudflare全自动搞定。

我之前用VPS部署的时候,光配置HTTPS就搞了大半天(还是用了Certbot),现在想想真是折腾...

自动部署咋用

配置完以后,每次你 git push 到GitHub,Cloudflare就会自动拉代码、构建、部署。

不用手动操作,不用登录后台,爽得不行。

而且Cloudflare会保留每次部署的记录,可以随时回滚到之前的版本。

有一次我改崩了首页,就是用回滚功能救回来的,真是救命功能...

说点缺点

当然,Cloudflare Pages也不是完美的。

最大的问题是:国内访问有时候会抽风

Cloudflare的IP在国内偶尔会被墙,虽然概率不大,但确实会发生。如果你主要读者在国内,可以考虑同时部署一份到国内的服务(比如腾讯云、阿里云)。

另外,Cloudflare Pages不支持SSH部署,只能用Git。如果你习惯用FTP上传文件... 那可能不太适合你(不过都2026年了,谁还用FTP啊...)

总结

如果你在找静态博客的托管平台,Cloudflare Pages值得一试。

免费、快速、省心,能满足大部分个人博客的需求。

我现在的博客就跑在Cloudflare Pages上,目前为止体验很棒,没出过啥问题。

好了,教程写完了。如果你在部署过程中遇到啥问题,欢迎留言,我看到了会回复~

P.S. 你们都在用哪个平台部署博客?来说说体验吧😊

标签: cloudflare 部署 静态博客

上一篇博客SEO优化那些事儿:我是怎么把关键词排到首页的

下一篇当前分类已是最新一篇

发布评论 0条评论)

  • Refresh code

还木有评论哦,快来抢沙发吧~