박종훈 기술블로그

[pnpm] firebase hosting deploy via github aciton

This post explains how to connect firebase hosting and github action in a pnpm based project.

In firebase cli, it provides integration of hosting and github action by default.

Deploy to live & preview channels via GitHub pull requests

When integrating through this method, a github workflow file will be created.
(firebase-hosting-merge.yml, firebase-hosting-pull-request.yml)

The contents are as follows.
(You only need to look at the jobs part. It is explained based on firebase-hosting-merge.yml.)

# 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@v3
      - run: npm ci && npm run build
      - uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: '$'
          firebaseServiceAccount: '$'
          channelId: live
          projectId: your_project_id

In this state, to proceed with install and build through pnpm, modify as follows.

# 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:
      - name: Checkout
        uses: actions/checkout@v3

      - name: Setup pnpm
        uses: pnpm/action-setup@v2
        with:
          version: 8

      - name: install dependencies and build
        run: pnpm install --frozen-lockfile && pnpm run build

      - name: deploy to firebase
        uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "$"
          firebaseServiceAccount: "$"
          channelId: live
          projectId: your_project_id

If you modify the code and push it to github,
You can see that it is built and reflected successfully.

github action

firebase hosting deploy

categories: 개발

tags: github , github action , pnpm , ci , firebase , firebase deploy , firebase hosting , deploy , hosting