正式なドキュメントは英語版であり、この日本語訳はAI支援翻訳により作成された参考用のものです。日本語訳の一部の内容は人間によるレビューがまだ行われていないため、翻訳のタイミングにより英語版との間に差異が生じることがあります。最新かつ正確な情報については、英語版をご参照ください。

静的サイトのGitLab Pagesデプロイを作成する

  • プラン: Free、Premium、Ultimate
  • 提供形態: GitLab.com、GitLab Self-Managed、GitLab Dedicated

GitLab Pagesデプロイを作成して、静的サイトまたはフレームワークをGitLabでホストされるウェブサイトに変換します。段階的なフォームを使用して、GitLabは以下を行います:

  • プロジェクト設定に基づいて、カスタムのCI/CD設定を生成します。
  • GitLab Pagesデプロイに合わせて設定された.gitlab-ci.ymlファイルを作成します。
  • レビューのために、マージリクエストによって変更を送信します。
  • マージリクエストがコミットされると、ウェブサイトを自動的にデプロイします。

このガイドでは、Pages UIを使用して、静的サイトまたはフレームワークベースのアプリケーションをデプロイする方法について説明します。

前提要件

  • アプリはpublicフォルダーにファイルを出力する必要があります。ビルドパイプライン中にこのフォルダーを作成する場合、Gitにコミットする必要はありません。

    この手順は重要です。ファイルがルートレベルのpublicフォルダーに確実に配置されるようにしてください。

  • 次のいずれかのプロジェクトが必要です:

    • EleventyAstroJekyllなどの静的サイトまたはクライアントレンダリングのシングルページアプリケーション(SPA)を生成するプロジェクト
    • Next.jsNuxtSvelteKitなどの静的出力用に設定されたフレームワークを含んでいるプロジェクト
  • プロジェクトに対してGitLab Pagesが有効になっている必要があります(有効にするには、設定 > 一般に移動し、可視性、プロジェクトの機能、権限を展開して、Pagesの切替をオンにします)。

Pagesのデプロイを作成する

セットアップを完了してGitLab Pagesデプロイを生成するには:

  1. 左側のサイドバーで、検索または移動先を選択して、プロジェクトを見つけます。

  2. デプロイ > Pagesを選択します。

    Get Started with Pages(Pagesを始める)フォームが表示されます。このフォームを利用できない場合は、トラブルシューティングを参照してください。

  3. ステップ1では、イメージ名を入力します。Pagesでデプロイするカスタムフォルダーを設定することもできます。

  4. 次へを選択します。

  5. ステップ2で、インストール手順を入力します。フレームワークのビルドプロセスで、用意されているビルドコマンドのいずれかが不要な場合は、次のいずれかを行います:

    • 次へを選択して、ステップをスキップします。
    • そのステップのボイラープレートを.gitlab-ci.ymlファイルに組み込む場合は、:(bashの「何もしない」コマンド)を入力します。
  6. 次へを選択します。

  7. Step 3(ステップ3)で、アプリケーションのビルド方法を示すスクリプトを入力します。

  8. 次へを選択します。

  9. オプション。必要に応じて、生成された.gitlab-ci.ymlファイルを編集します。

  10. Step 4(ステップ4)で、コミットメッセージを追加し、コミットを選択します。このコミットにより、最初のGitLab Pagesデプロイがトリガーされます。

実行中のパイプラインを表示するには、ビルド > パイプラインに移動します。

デプロイ中に作成されたアーティファクトを表示するには、ジョブを表示し、右側のアーティファクトをダウンロードを選択します。

トラブルシューティング

Get Started with Pagesフォームを利用できない場合

次の場合、Get Started with Pagesフォームは利用できません:

  • 以前にGitLab Pagesサイトをデプロイした。
  • 少なくとも1回、フォームから.gitlab-ci.ymlをコミットした。

この問題を解決するには:

  • メッセージPagesのパイプラインの完了を待っていますが表示された場合は、最初から実行を選択してフォームを再度開始します。
  • プロジェクトで以前にGitLab Pagesが正常にデプロイされた場合は、.gitlab-ci.ymlファイルを手動で更新します。