在本教程中,你将了解如何将现有使用 Jekyll 的 GitHub Pages 站点 ↗迁移到 Cloudflare Pages。Jekyll 是与 GitHub Pages 配合使用最流行的静态站点生成器之一,将 GitHub Pages 站点迁移到 Cloudflare Pages 只需几个简单步骤。
本教程将引导你完成:
- 向项目配置添加 GitHub Pages 使用的必要依赖。
- 创建新的 Cloudflare Pages 站点,连接到你现有的 GitHub 仓库。
- 在 Cloudflare Pages 上构建并部署站点。
- (可选)迁移自定义域名。
包括构建时间在内,本教程应在 15 分钟内完成。
本教程假设:
- 你已有使用 Jekyll ↗ 的 GitHub Pages 站点
- 你熟悉运行 Ruby 命令行工具,并已安装
gem和bundle - 你了解如何使用一些基本的 Git 操作,包括
add、commit、push和pull - 你已阅读 Cloudflare Pages 的快速入门指南
若你的机器上未安装 Rubygems(gem)或 Bundler(bundle),请参阅 Rubygems ↗ 和 Bundler ↗ 的安装指南。
现有基于 Jekyll 的仓库必须指定 Gemfile(Ruby 的依赖配置文件),以便 Cloudflare Pages 在构建步骤中获取并安装这些依赖。
具体而言,你需要创建 Gemfile 并安装 github-pages gem,其中包含 GitHub Pages 环境假定的所有依赖。
Pages 构建环境版本 2 将使用 Ruby 3.2.2 作为默认 Jekyll 构建版本。请确保本地开发环境兼容。
brew install ruby@3.2
export PATH="/usr/local/opt/ruby@3.2/bin:$PATH"cd my-github-pages-repo
bundle init打开为你创建的 Gemfile,在文件末尾添加以下行:
gem "github-pages", group: :jekyll_plugins你的 Gemfile 应类似如下:
# frozen_string_literal: true
source "https://rubygems.org"
git_source(:github) { |repo_name| "https://github.com/#{repo_name}" }
# gem "rails"
gem "github-pages", group: :jekyll_plugins运行 bundle update,将为你安装 github-pages gem,并创建包含已解析依赖版本的 Gemfile.lock 文件。
bundle update
# Bundler will show a lot of output as it fetches the dependencies这应成功完成。若未成功,请确认你已准确复制上述 github-pages 行,且未用前导 # 将其注释掉。
现在需要将这些文件提交到仓库,以便 Cloudflare Pages 在后续步骤中引用:
git add Gemfile Gemfile.lock
git commit -m "deps: added Gemfiles"
git push origin mainGitHub Pages 项目现已明确指定依赖,你可以开始配置 Cloudflare Pages。该过程与部署 Jekyll 站点几乎相同。
要将站点部署到 Pages:
-
在 Cloudflare 仪表板中,前往 Workers & Pages 页面。
Go to Workers & Pages ↗ -
选择 Create application(创建应用程序) > Pages > Import an existing Git repository(导入现有 Git 仓库)。
-
选择你创建的 GitHub 仓库,在 Set up builds and deployments(设置构建和部署) 部分提供以下信息:
| 配置选项 | 值 |
|---|---|
| Production branch | main |
| Build command | jekyll build |
| Build directory | _site |
配置站点后,即可开始首次部署。你将看到 Cloudflare Pages 安装 jekyll、项目依赖并构建站点,然后部署。
部署站点后,你将在 *.pages.dev 上获得项目的唯一子域名。每次向 Jekyll 站点提交新代码,Cloudflare Pages 都会自动重新构建并部署项目。你还可以在新拉取请求上获得预览部署,在部署到生产环境之前预览更改效果。
若你在 GitHub Pages 上使用自定义域名 ↗,必须更新 DNS 记录以指向新的 Cloudflare Pages 部署。需要在域名的 DNS 提供商处更新 CNAME 记录,指向 <your-pages-site>.pages.dev,替换 <your-username>.github.io。
请注意,根据创建记录时设置的 DNS TTL(生存时间)值,DNS 缓存过期并反映此更改可能需要一些时间。
有关详细步骤列表,请参阅快速入门指南中的添加自定义域名部分。
- 了解如何使用 Cloudflare Workers 自定义 Pages 站点的 HTTP 响应标头。
- 了解如何回滚可能损坏的部署到之前可用的版本。
- 配置重定向,确保访问者始终被定向到「规范」自定义域名。