ホーム / 公開ガイド / 無料公開
PR・広告について:現在この記事にはアフィリエイト広告リンクを設置していません。将来掲載する場合は明確に表示します。
無料公開AstroサイトをCloudflare Pagesで公開する方法|GitHub連携とビルド設定
Astroで生成した静的サイトは、Cloudflare PagesでGitHub連携による自動デプロイが可能です。
1. GitHubへコードを保存
AstroプロジェクトをGitHubリポジトリへ登録します。公開したくないAPIキーやパスワードをリポジトリに含めないでください。
2. PagesからGitHubを接続
Cloudflareダッシュボードで Workers & Pages → Create application → Pages → Import an existing Git repository の順に進みます。Workersの作成フローとは区別してください。
3. ビルド設定を入力
Astroの一般的な静的サイトでは、本番ブランチ main、ビルドコマンド npm run build、出力ディレクトリ dist を使用します。プロジェクト固有の設定がある場合はそちらを優先します。
4. デプロイ結果を確認
デプロイが成功したら発行されたpages.dev URLを開き、トップページ・下層ページ・スマートフォン表示を確認します。ビルド成功とデプロイ成功は別なので、ログの最終結果まで確認しましょう。
5. GitHub更新で自動反映
Cloudflare PagesのGit連携では、対象ブランチへのコミットに応じて再ビルド・再デプロイされます。更新後はリンク切れや表示崩れを確認します。
よくある失敗:Workersのデプロイコマンドを使う
Pagesのダッシュボード連携では通常、個別に npx wrangler deploy を指定する必要はありません。Workers向け設定が自動で入った場合は、作成フローを見直してください。
参考にした公式資料
内容は2026年10月時点の公式情報をもとに整理しています。サービス仕様は変更されるため、実際の設定前に公式案内をご確認ください。