はじめに
こんにちは！Halです！
Reactで作成したSPAをFirebase Hostingにデプロイする際、pnpmを使用している環境下でGitHub Actionsのワークフローがエラーになったので解決方法をまとめます。
問題
firebase initでHosting機能を選択して自動生成されたGitHub Actionsワークフローファイルを使用した際、pnpmを利用しているプロジェクトで以下のエラーが発生しました：
/bin/sh: 1: pnpm: not found
Error: Process completed with exit code 127.
発生した状況：
- Reactプロジェクトでpnpmをパッケージマネージャーとして使用
-
firebase initで生成されたワークフローファイルをそのまま使用 - GitHub ActionsのUbuntuランナーにはnpmとyarnはデフォルトでインストールされているが、pnpmは含まれていない
生成されたワークフローファイル（エラーが発生するもの）：
# This file was auto-generated by the Firebase CLI
name: Deploy to Firebase Hosting on merge
on:
push:
branches:
- main
jobs:
build_and_deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- run: pnpm install --frozen-lockfile && pnpm run build # ← ここでpnpmが見つからずエラー
- uses: FirebaseExtended/action-hosting-deploy@v0
with:
repoToken: ${{ secrets.GITHUB_TOKEN }}
firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_JISOU_PROJECT }}
channelId: live
projectId: jisou-project
解決方法
pnpmをセットアップするステップを追加することで解決できます。
修正後のワークフローファイル：
# This file was auto-generated by the Firebase CLI
# https://github.com/firebase/firebase-tools
name: Deploy to Firebase Hosting on merge
on:
push:
branches:
- main
jobs:
build_and_deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- name : Setup pnpm
uses : pnpm/action-setup@v4
with :
version: 10
- name : Setup Node.js
uses : actions/setup-node@v4
with :
node-version : 22
cache : "pnpm"
- name : Install and build
run: pnpm install --frozen-lockfile && pnpm run build
- uses: FirebaseExtended/action-hosting-deploy@v0
with:
repoToken: ${{ secrets.GITHUB_TOKEN }}
firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT_JISOU_PROJECT }}
channelId: live
projectId: jisou-project
変更点：
-
Setup Node.jsステップを追加 -
Setup pnpmステップを追加してpnpmをインストール
おわりに
Firebase CLIが自動生成するワークフローはnpmベースなので、pnpmを使う場合は手動でセットアップが必要ですね。同じ問題で困っている方の参考になれば幸いです。
参考
JISOUのメンバー募集中！
プログラミングコーチングJISOUでは、新たなメンバーを募集しています。
日本一のアウトプットコミュニティでキャリアアップしませんか？
興味のある方は、ぜひホームページをのぞいてみてくださ！
▼▼▼