Astro をデプロイする

ロリポップ！デプロイナウは、Astro の静的サイトと、@astrojs/node アダプタを使ったサーバーでの実行に対応しています。

公開するときは、フレームワークに astro を選びます。

lolipop deploy --name <name> --framework astro

対話形式でプロジェクトを作る場合も、フレームワークの選択で astro を選びます。 利用できるフレームワーク名は lolipop frameworks list で確認できます。

静的サイトとサーバー

アダプタを使わないアプリは静的サイトとして、@astrojs/node アダプタを使うアプリはサーバーで実行して公開されます。 どちらになるかはビルドの結果から自動で決まるため、フレームワークの設定を変える必要はありません。

サーバーで実行するには、@astrojs/node アダプタを追加します。

npx astro add node

デフォルトのビルド設定

フレームワークに astro を選ぶと、次のビルド設定が適用されます。

• インストールコマンド: npm ci --ignore-scripts
• ビルドコマンド: npm run build
• 出力ディレクトリ: dist

astro.config の outDir を変えている場合は、出力ディレクトリを同じ値に合わせます。

lolipop build-config update --project <id> --output build

astro.config の設定

サーバーで実行する場合は、astro.config を次のように設定します。

// astro.config.mjs
import { defineConfig } from 'astro/config'
import node from '@astrojs/node'
 
export default defineConfig({
  site: 'https://<サブドメイン>.lolipop-now.app',
  adapter: node({ mode: 'standalone' }),
  security: {
    allowedDomains: [
      { hostname: '<サブドメイン>.lolipop-now.app', protocol: 'https' },
      { hostname: '*.preview.lolipop-now.app', protocol: 'https' },
      { hostname: 'www.example.com', protocol: 'https' },
    ],
  },
})

• site: 公開する URL。canonical URL やサイトマップの生成に使われます。静的サイトでも設定します
• adapter: mode: 'standalone' で使います。npx astro add node で追加した場合は、この設定になっています
• security.allowedDomains: 公開するドメインを列挙します。1 行目は公開 URL、2 行目は PR のプレビュー、3 行目は独自ドメインです。独自ドメインを使わない場合は 3 行目を削除し、独自ドメインを追加したときはこの設定にも追加してデプロイし直します。設定しないドメインでは、フォームの送信が 403 で失敗し、Astro.url が公開している URL と異なる値になります

モノレポではルートを指定する

Astro アプリがリポジトリのサブディレクトリにある場合は、ビルドのルートをアプリのディレクトリに合わせます。

lolipop deploy --name <name> --framework astro --root apps/web

既存プロジェクトの設定は build-config update で変更できます。

lolipop build-config update --project <id> --root apps/web

対応していない機能

環境変数や .env の扱いは環境変数を参照してください。