はじめに
アプリケーション開発において、GitHub Actionsのワークフローからデプロイを行おうとしたときに、詰まった部分があったので、ここに解決方法を記載する。
開発環境
React + TS
ローカルのVSCodeで開発、firebaseでホスティング、デプロイ
困った部分
ローカルからデプロイする場合は、npm run build後にfirebase deployのコマンドを叩けばうまく行っていたが、GitHub Actionsで同様のコマンドを実行させてデプロイを行ったとき、コンソールでsecretsの値が存在しないことが理由でエラーになっていた。
secretは.envファイル内に記載されているが、.gitignoreでGitHubリポジトリにコミットしないように設定されており、そのままだとデプロイ先にsecretが渡されない。
解決方法
GitHubのリポジトリのSetting→Security→Secrets and variables→Actionsから、secretsの値を設定して、workflowのenv
に追加すれば、デプロイ先でもsecretsを読み込んでくれた。

↑workflowを定義するmain.yml。firebaseをデプロイする際にenvを指定でき、そこで、GitHubに設定したsecretsを読み込ませることができる。
まとめ
SaaSやIaaSはとにかく設定項目が多く、ちょっとした見落としでうまく行かなくなることが多い。
こうしたものは大抵先人たちが何らかの対処方法を見つけているので、ネット検索を活用して解決していこうと思った。
1/27追記
上記main.ymlだと、デプロイ先でsupabaseのsecretsが読み込まれていなかった。
VITE_SUPABASE_ANON_KEYとVIRE_SUPABASE_URLのenv定義をnpm run buildの直後に移動したら、正常になった。
JISOUのメンバー募集中!
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか?
興味のある方は、ぜひホームページをのぞいてみてください!
▼▼▼

