GitHub リポジトリから自動で Workers にデプロイのメモ

前回の OpenNext と Wrangler を設定して、ローカルから Cloudflare Workers へデプロイは成功したので、それに続き今回は GitHub のリポジトリにプッシュした時に、自動で Cloudflare Workers へデプロイされるように設定したい。

Workers & Pages の設定

AI に聞きながら、Workers & Pages の設定タブの、ビルドの部分を設定。
連携する GitHub リポジトリ、ビルド構成、変数とシークレットというの部分を設定した。

ビルド失敗

１回目の失敗

GitHub リポジトリと連携後、GitHub にプッシュしたら、Workers の管理画面で早速自動ビルドが始まったことが確認できた。
だけど、1回目はビルド失敗。

OpenNext を使ってデプロイする時、next.config.ts に output: ‘export’ を設定しているとエラーが出て上手くビルド出来ないようだ。

output: ‘export’ は、Next.js アプリが純粋な静的サイトとしてビルドされる設定で、OpenNext のビルドプロセスとは違うようだ。

SSG で静的サイトにしようかと思っていたが、そこに OpenNext を使ってみようというのが間違いだったのかもしれない？
この辺りはちょっと理解できていない。

（SSG でデプロイするなら、OpenNext は使わずにローカルでビルドしたHTMLなどをアップすればいいだけなのかも？）

2回目の失敗

next.config.ts に output: ‘export’ 部分をコメントアウトしたら無事にデプロイ成功。

っと思ったら、2回目もエラー。
デプロイした URL にアクセスすると「500 Internal Server Error.」と表示されてしまった。

原因は「変数とシークレット」という API_KEY などを登録しておく項目をビルドの欄だけでしか設定していなかったからのようだ。
ページの比較的始めの方にも「変数とシークレット」という項目があり、そこに secret として、microCMS の API_KEY とSERVICE_DOMAIN を設定したら、表示されるようになった。

SSG のつもりだったので、ビルドの部分だけで大丈夫かと思ったが違ったようだ。

悪戦苦闘しながらも、なんとか GitHub リポジトリからデプロイできたので、次は別ブランチとしてサイトに更新加えた場合のバージョンを、テストとしてデプロイすることに挑戦する。