Jekyll を使用して GitHub Pages サイトをローカルでテストする

リポジトリの読み取りアクセス許可を持つすべてのユーザーは、 GitHub Pages サイトをローカルでテストできます。

前提条件

Jekyll を使用してサイトをテストする前に、以下の操作が必要です。

• Jekyll をインストールする。
• Jekyll サイトを作成する。 詳しくは、「Jekyll を使用して GitHub Pages サイトを作成する」をご覧ください。

Bundler を使用して Jekyll をインストールして実行することをお勧めします。 Bundler は、Ruby gem の依存関係を管理し、Jekyll ビルドのエラーを減少させ、環境に関係するバグを防止します。 以下はBundlerのインストール手順です。

1. Ruby をインストールします。 詳しくは、Ruby のドキュメントで「Ruby のインストール」を参照してください。
2. Bundlerをインストールしてください。 詳しくは、Bundler のページを参照してください。

サイトをローカルでビルドする

1. [ターミナル][ターミナル][Git Bash] を開きます。

2. サイトの公開ソースにアクセスしてください。 詳しくは、「GitHub Pages サイトの発行ソースの構成」をご覧ください。

3. bundle install を実行します。

4. ローカルで Jekyll サイトを実行します。

   $ bundle exec jekyll serve
   > Configuration file: /Users/octocat/my-site/_config.yml
   >            Source: /Users/octocat/my-site
   >       Destination: /Users/octocat/my-site/_site
   > Incremental build: disabled. Enable with --incremental
   >      Generating...
   >                    done in 0.309 seconds.
   > Auto-regeneration: enabled for '/Users/octocat/my-site'
   > Configuration file: /Users/octocat/my-site/_config.yml
   >    Server address: http://127.0.0.1:4000/
   >  Server running... press ctrl-c to stop.
   

   メモ

   • Ruby 3.0 以降をインストールした場合 (Homebrew を使用して既定のバージョンをインストールした場合に発生することがあります)、この手順でエラーが発生するおそれがあります。 これは、これらのバージョンの Ruby には、webrick がインストールされなくなったためです。

     エラーを修正するには、bundle add webrick を実行してから bundle exec jekyll serve をもう一度実行します。

     Ruby 3.2 以降をインストールしている場合は、 github-pages gem との互換性の問題により、不足している gem とメソッドに関連するその他のエラーが表示されることがあります。 この場合は、代わりに Ruby 3.1.x 以前をインストールする必要があります。

_config.yml ファイルの baseurl フィールドにGitHub リポジトリのリンクが含まれている場合は、ローカルでビルドするときに次のコマンドを使用して、その値を無視し、localhost:4000/ でサイトを提供できます。

bundle exec jekyll serve --baseurl=""

1. サイトをプレビューするには、Web ブラウザーで http://localhost:4000 に移動します。

GitHub Pages gem の更新

Jekyll は、頻繁に更新されるアクティブなオープンソース プロジェクトです。 コンピューター上のgithub-pages gem が GitHub Pages サーバー上の github-pages gem と古い場合、サイトがローカルにビルドされたときと、GitHubで公開された場合とは異なる場合があります。 これを回避するには、お使いのコンピューターで github-pages gem を定期的に更新します。

1. [ターミナル][ターミナル][Git Bash] を開きます。
2. github-pages gem を更新します。
   • Bundler をインストールしている場合、bundle update github-pages を実行します。
   • Bundler をインストールしていない場合、gem update github-pages を実行します。

参考資料

• GitHub Pages Jekyll ドキュメント内