AstroサイトをGitLab Pagesにデプロイする
GitLab Pagesを使って、GitLabのプロジェクトやグループ、ユーザーアカウント用のAstroサイトをホストすることができます。
公式GitLab Pages Astroサンプルプロジェクトを確認してください!
デプロイ方法
セクションタイトル: デプロイ方法-
astro.config.mjs
に正しいsite
を設定します。 -
public/
ディレクトリをstatic
にリネームします. -
astro.config.mjs
にoutDir:public
を設定します。この設定は、静的ビルドの出力をGitLab Pagesがファイルを公開するために必要なフォルダであるpublic
というフォルダに置くようにAstroに指示します。public/
ディレクトリをAstroプロジェクトで静的ファイルのソースとして使用していた場合は、名前を変更し、astro.config.mjs
のpublicDir
の値に新しいフォルダ名を指定します。例えば、
public/
ディレクトリをstatic/
にリネームした場合のastro.config.mjs
の正しい設定は以下の通りです。import { defineConfig } from 'astro/config';export default defineConfig({site: 'https://<user>.gitlab.io',base: '/<project-name>',outDir: 'public',publicDir: 'static',}); -
プロジェクトのルートに
.gitlab-ci.yml
というファイルを以下の内容で作成します。これにより、コンテンツを変更するたびにサイトをビルドしてデプロイすることができます。pages:# アプリのビルドに使用するDockerイメージimage: node:ltsbefore_script:- npm ciscript:# アプリのビルドに必要な手順をここで指定します- npm run buildartifacts:paths:# 公開するビルド済みのファイルを含むフォルダ。# "public"を指定する必要があります。- publiconly:# 以下のブランチへのプッシュがある時のみに、新しいビルドとデプロイをトリガーします。- main