メインコンテンツへスキップ
Hero Image

Astro 製サイトを Cloudflare Pages にデプロイする

Astro Cloudflare Pages

結論

Astro で作ったサイトを Cloudflare Pages にデプロイするには、pnpm astro add cloudflarepnpm add -D wrangler を実行し、wrangler.jsoncastro.config.mjs に必要な設定を書く必要がある。

背景

ブログをリニューアルした。 Astro を 2.0 系から 5.16 に上げたり、構造も以前とは大きく変えるため、リファクタリングをするには面倒そうだった。 そのため、新しいリポジトリを作り、以前のブログの MDX ファイルだけを移すことにした。

ホスティングには以前から Cloudflare Pages を使っている。 新しくプロジェクトを作ってデプロイを試したところ、使い勝手が以前と変わっていた。 これまではビルドコマンドを設定するだけでよかったが、 現在は npx wrangler deploy を使う流れになっていた。 ビルド自体は問題なく進むものの、グローバルネットワークへのデプロイの段階でエラーになった。

対応

まず、pnpm astro add cloudflare を実行した。 すると、astro.config.mjs に Cloudflare 対応の設定が追加され、wrangler.jsonc も生成された。 これだけでは wrangler コマンドは使えず、pnpm add -D wrangler を実行する必要があった。

以前設定したときから 2 年が経ち、Cloudflare Pages のビルドシステムがバージョンアップしていた。 必要な設定を揃えることで、Cloudflare Pages へのデプロイは問題なく完了した。