📑

GitHub Actionsでfirebase hostingへ自動デプロイした時のメモ

2023/05/11に公開

前提

GitHubにリモートリポジトリ、ローカルにローカルリポジトリが
設定済みで、ローカルからfirebaseへの連携も完了している状況でした。
その状態からリモートのmainブランチにマージしたタイミングで
Actionsが走りfirebase hostingに自動デプロイされるということを行いました。

設定手順

1. GitHubにリモートリポジトリを設定します。(今回は作成済みなので飛ばします。リポジトリの管理者権限が必要です)

2. 次のコマンド'firebase init hosting:github'をローカルリポジトリで実行します。
 するとブラウザでGitHubの画面が表示されるので紐付けされようとしているGitHubアカウントを確認します。
※ここでGitHubのアカウントが複数あると違うアカウントと紐付いてしまう場合があります。
違うアカウントと紐づきそうになったら「cancel」を選択し停止してから
PCに設定されているデフォルトブラウザで紐づけたいアカウントで
GitHubにログインした状態で再度実行します。

3. 次の画面が表示されるので「Authorize firebase」をクリックします。

4. コマンドラインの画面に戻ると以下のようにAuthorizeが成功したことと
 どのリポジトリに接続するかを確認されます。
ユーザー名/リポジトリ名の順番で入力をします。

5. 次に以下の質問がされます。これはReactなど事前にビルドが必要なアプリですか?という質問になります。
 今回はJavaScriptなので「N」を選択します。

 Set up the workflow to run a build script before every deploy?N

6. また質問が表示されます。これはブランチにマージされた時に自動的にデプロイしますか?という質問になりますので「Y」を選択します。

 Set up automatic deployment to your site's live channel when a PR is merged? (Y/n) Y

7. 対象のブランチを選択します。今回はmainブランチにマージされたタイミングでデプロイしたいのでmainと入力します。

 What is the name of the GitHub branch associated with your site's live channel? main
  1. 「Firebase initialization complete!」と表示されたら完了です。
     

トラブル

遭遇したトラブルもメモしておきます。
私の場合上記手順を実行した時にfirebaseのローカルプロジェクトが初期化されてしまいました。
ゆえにfirebase.json、.firebasercといったファイルも削除された状態になっていました。
ただfirebase hosting上、ローカルのファイル、gitのログが消えるということはなく
firebase initを再実行し、そこで再度前述の設定手順が聞かれるので
その手順に沿って実行したら無事GitHub Actionsから
firebase hostingへの自動デプロイが設定できました。

参考ページ

firebase公式

Discussion