INTEGRITY Документация

Перенос сайта на Jekyll с GitHub Pages

В этом руководстве вы узнаете, как перенести существующий Сайт GitHub Pages на Jekyll на Cloudflare Pages. Jekyll является одним из самых популярных генераторов статических сайтов, используемых с GitHub Pages, поэтому перенос вашего сайта с GitHub Pages на Cloudflare Pages займёт всего несколько простых шагов.

Это руководство проведёт вас через следующие этапы:

  1. Добавление в конфигурацию проекта необходимых зависимостей, которые использует GitHub Pages.
  2. Создание нового сайта Cloudflare Pages, подключённого к существующему репозиторию GitHub.
  3. Сборка и развертывание сайта на Cloudflare Pages.
  4. (Необязательно) Перенос вашего пользовательского домена.

С учётом времени сборки это руководство займёт у вас менее 15 минут.

Перед началом работы

Это руководство предполагает следующее:

  1. Если у вас уже есть сайт на GitHub Pages, использующий Jekyll
  2. У вас есть опыт работы с инструментами командной строки Ruby, а также установлены gem и bundle установлен.
  3. Вы знакомы с несколькими базовыми операциями Git, включая add, commit, push, а также pull.
  4. Вы ознакомились с Начало работы руководство по Cloudflare Pages.

Если у вас не установлен Rubygems (gem) или Bundler (bundle) установлен на вашем компьютере, обратитесь к руководствам по установке для Rubygems и Bundler.

Подготовка репозитория GitHub Pages

В существующем репозитории на основе Jekyll должен быть указан Gemfile (файл конфигурации зависимостей Ruby), чтобы Cloudflare Pages мог получить и установить эти зависимости во время этап сборки.

В частности, вам потребуется создать Gemfile и установите github-pages gem, который включает все зависимости, предполагаемые окружением GitHub Pages.

Версия 2 среды сборки Pages будет использовать Ruby 3.2.2 для сборки Jekyll по умолчанию. Убедитесь, что ваша локальная среда разработки совместима с этой версией.

Настройка версии Ruby
brew install [email protected]
export PATH="/usr/local/opt/[email protected]/bin:$PATH"
Создайте Gemfile
cd my-github-pages-repo
bundle init

Откройте Gemfile который был создан для вас, и добавьте следующую строку в конец файла:

Указание версии github-pages
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
bundle update
# Bundler will show a lot of output as it fetches the dependencies

Это должно завершиться успешно. Если нет, проверьте, что вы скопировали github-pages строку выше точно так, как указано, и не закомментировали её, добавив в начале #.

Теперь эти файлы нужно закоммитить в репозиторий, чтобы Cloudflare Pages мог ссылаться на них на следующих шагах:

Закоммитьте Gemfile и Gemfile.lock
git add Gemfile Gemfile.lock
git commit -m "deps: added Gemfiles"
git push origin main

Настройка проекта Pages

Теперь, когда проект GitHub Pages явно указывает свои зависимости, можно приступить к настройке Cloudflare Pages. Процесс почти идентичен развёртывание сайта на Jekyll.

Чтобы развернуть сайт в Pages:

  1. На панели управления Cloudflare перейдите к разделу Workers & Pages страницу.

    Перейдите в Workers & Pages ↗
  2. Выберите Создать приложение > Pages > Импорт существующего репозитория Git.

  3. Выберите созданный вами новый репозиторий GitHub и в разделе Настройка сборок и деплоев раздел и укажите следующую информацию:

Параметр конфигурации Значение
Продакшен-ветка main
Команда сборки jekyll build
Директория сборки _site

После того как вы настроите сайт, вы можете запустить первый деплой. Вы увидите, как Cloudflare Pages устанавливает jekyll, зависимостей вашего проекта и сборку сайта, прежде чем развернуть его.

После деплоя сайта вы получите уникальный поддомен для своего проекта на *.pages.dev. Каждый раз, когда вы фиксируете новый код на сайте Jekyll, Cloudflare Pages автоматически пересоберет ваш проект и развернет его. Вы также получите доступ к развёртывания предпросмотра для новых pull request, чтобы вы могли увидеть, как изменения выглядят на сайте, прежде чем разворачивать их в продакшен.

Перенос пользовательского домена

Если вы используете пользовательский домен с GitHub Pages, необходимо обновить DNS-записи так, чтобы они указывали на новое развёртывание Cloudflare Pages. Для этого потребуется обновить CNAME запись у DNS провайдера вашего домена, чтобы она указывала на <your-pages-site>.pages.dev, заменив <your-username>.github.io.

Учтите, что истечение срока действия DNS-кэшей и отображение изменений может занять некоторое время в зависимости от значения DNS TTL (time to live), заданного при первоначальном создании записи.

См. добавление пользовательского домена раздел руководства «Начало работы» для получения списка подробных шагов.

Что дальше?