FirebeseでCDを実行すると`Directory 'dist' for Hosting does not exist`エラーが発生した

はじめに

FirebaseでCDを実行するとエラーが起きて本日半日は潰しました⋯
この件で沼ったことこの最後の記事です。

エラー内容

=== Deploying to '***'...
i  deploying hosting
i  hosting[***]: beginning deploy...
Error: Directory 'dist' for Hosting does not exist.
Error: Process completed with exit code 1.

distってあるのでbuildで生成されたものがなにかおかしいってのは予測が付きますね。

Firebase Hosting は firebase.json で指定されたディレクトリ（通常 dist）をアップロードします。
このエラーメッセージは

  {
    "hosting": {
      "public": "dist"  ← このディレクトリを探す
    }
  }

deploy ジョブの VM に dist ディレクトリが存在しなかったため、「アップロードするものがない」というエラーです。

githubActionsでは下記のようにコマンドごとにジョブが分けて管理されています

    build ジョブ (VM-A)          deploy ジョブ (VM-B)
  ├── checkout                 ├── checkout
  ├── npm install              ├── dist ← ここにない！
  ├── npm run build            └── firebase deploy
  └── dist ← ここで生成
      （ジョブ終了で消える）

つまり、仮想環境（VM）でbuildが終わる　→　ジョブが消される →　deployのジョブではdistがない
ファイルを直接引き継ぐことはできない と言うことです。

問題のコード

    steps:
    - name: Upload build artifacts
        uses: actions/upload-artifact@v4


　　　　~省略〜

    steps:
      - name: Checkout code
        uses: actions/checkout@v6
      - name: Download build artifacts
        uses: actions/download-artifact@v4
      - name: Setup Node.js and cache

これではgithubActionsはbuildファイルを見つけることができないから今回のようなエラーを出します

解決

修正コード

    steps:
    - name: Upload build artifacts
        uses: actions/upload-artifact@v4
        with:
          name: dist
          path: dist

　　　　~省略〜
    
    steps:
      - name: Checkout code
        uses: actions/checkout@v6
      - name: Download build artifacts
        uses: actions/download-artifact@v4
        with:
          name: dist
          path: dist
      - name: Setup Node.js and cache

ファイル共有を実現しているのは actions/upload-artifact と actions/download-artifact というアクションです。

  # build ジョブ
  - uses: actions/upload-artifact@v4  ← このアクションが
    with:                             ← これらのパラメータで動く
      name: dist                      ← 成果物の名前
      path: dist                      ← アップロードするパス

  # deploy ジョブ
  - uses: actions/download-artifact@v4  ← このアクションが
    with:                               ← これらのパラメータで動く
      name: dist                        ← 取得する成果物の名前
      path: dist                        ← ダウンロード先のパス

流れ：

1. upload-artifact が dist フォルダを圧縮してGitHub のストレージに保存
2. download-artifact がそれを取得して展開

with は「何を」「どこに」を指定しているだけで、実際の処理はアクション内部で行われています
withを使って明示的にdistを指定することで正常にFirebaseでのCDが動くようになりました。

おわりに

今回はFirebaseでCDを実装する方法について学習しました。
GithubActionではジョブ間でbuild成果物を共有できないことまた、それの対処方法について
知見が増えました。
問題特定に時間を沢山使ってしまいましたがその過程にも沢山の学びがありました。