把 Hugo 网站从 Vercel 搬到 Cloudflare Pages

💡 原文中文,约3200字,阅读约需8分钟。
📝

内容提要

本站已从 Vercel 迁移至 Cloudflare Pages,解决了文章更新时间错误和流量问题。迁移过程中进行了重定向配置、创建应用和删除旧项目,并修复了 404 页面缺失的问题,确保网站正常运行。

🔎

延伸解读

迁移的核心原因:Vercel 的浅克隆限制

文章指出 Vercel 在构建时只获取 Git 仓库的前十次提交,导致 Hugo 网站中依赖完整提交历史的文章更新时间出错,变成最新提交的时间。而 Cloudflare Pages 支持克隆整个仓库,能正确获取所有提交信息,从而修复更新时间显示问题。此外,本站 RSS 订阅文件消耗流量大,Cloudflare Pages 的无限流量也更合适。

重定向配置的差异与迁移要点

从 Vercel 迁移到 Cloudflare Pages 时,重定向配置的写法完全不同。Vercel 使用 JSON 格式定义 redirects,而 Cloudflare Pages 使用纯文本文件,每行一条规则,并支持 splat 和 placeholder。文章给出了具体的配置示例,包括旧中文网站路径到 /zh-cn/ 的 308 重定向,以及 RSS 链接去除尾部斜杠等。迁移时需重新编写这些规则,确保旧链接正确跳转。

多语言站点的 404 页面问题与修复

由于 Hugo 配置了 defaultContentLanguageInSubdir = "true",构建后根目录没有 404.html,只有 /en/ 和 /zh-cn/ 子目录下有。这导致 Cloudflare 将网站视为单页应用,访问不存在的路径时会跳转到首页并返回 200 状态码。文章通过让 Hugo 在根目录生成 404.html 解决了此问题,并提到使用了自写的 404 页面。

迁移后的优化与注意事项

迁移后,作者删除了之前在 Cloudflare 设置的 RSS 文件缓存规则,因为不再需要。同时发现 Cloudflare 会缓存 custom.css,改用 SCSS 格式可以避免问题。创建 Cloudflare Pages 应用时,需设置构建命令为 git fetch --unshallow && hugo,输出目录为 public,并指定 HUGO_VERSION 为 0.99.1。这些细节有助于确保迁移后网站性能正常。

❓

Q&A

为什么将 Hugo 网站从 Vercel 迁移到 Cloudflare Pages?

迁移是为了修复文章更新时间错误和流量问题,Cloudflare Pages 支持克隆整个仓库,适合本站需求。

迁移过程中需要进行哪些主要步骤?

主要步骤包括重定向配置、创建 Cloudflare Pages 应用和删除旧的 Vercel 项目。

Cloudflare Pages 的重定向配置与 Vercel 有什么不同?

Cloudflare Pages 的重定向配置写法与 Vercel 不同,需要重新编写配置文件。

如何解决 Cloudflare Pages 导致的 404 页面缺失问题?

需要确保 Hugo 构建后根目录有 404.html 文件,以避免错误的跳转行为。

迁移后如何优化网站性能?

迁移后删除不再需要的缓存规则,以确保网站性能优化。

在 Cloudflare Pages 上如何配置 Hugo 网站?

需要设置构建命令、输出目录和 HUGO 版本等参数,具体操作可参考相关教程。

🏷️

标签

➡️

继续阅读