Flutter で作成した Web アプリを Github Pages で公開する
January 22, 2022
背景
Flutter で作った静的コンテンツを Github Pages に公開する方法を記載します。
以下のサイトは、Flutter で使える物理エンジンモジュール Forge2D を利用して遊びで作ったものです。
https://hnishi.github.io/hello_forge2d/
これを github pages で公開しようとしたときに、 flutter 公式の doc があまり親切に書いてくれていないのと、意外と記事が少なかったのと、ちょっとハマりどころがあったため、記事にします。
結論
Github Actions を利用して、repository に push されたら自動で公開されるようにします。
以下のページを参考に、github repository で github pages で公開するための設定を行う。
以下、github actions の設定をご覧ください。
肝は、 flutter build -v web --release --web-renderer canvaskit --base-href "/$(basename $GITHUB_REPOSITORY)/" の --base-href オプションです。
https://hnishi.github.io/hello_forge2d/ のように、ページの URL が、ドメイン直下ではない場合には、 --base-href オプションを指定すれば良いです (ここに少しハマりました)。(ドメイン直下を root として使う場合には、関係ない話ですが。。。)