하고 싶은 일

특정 지점에 push/merge로 각각 다른 환경에 배포

한 번에 Firebase Hosting과 Cloud Functions 모두에 배포

개략도

사용하는 것

Github Actions

Github secrets

Firebase CLI

절차 모두 3단계

프로시저 1. 워크플로우용 yaml을 작성하십시오.

다음은 staging 브랜치에 push했을 때에 이번 하고 싶은 처리를 실행하는 yaml.
이것을 .github/workflows 바로 아래에 놓습니다.
production(프로덕션 환경) 브랜치에도 마찬가지의 처리를 하고 싶은 경우는, 브랜치명을 지정하는 부분만을 main에 재기록한 yaml를 작성해 동일하게 .github/workflows 바로 아래에 배치한다.

name: Deploy The App To Firebase Hosting and Cloud Functions For Firebase
# 実行タイミング
"on":
  push: # pushで実行される。マージも含まれる
    branches:
      - staging  # どのブランチにマージした時に実行して欲しいか。

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - name: Checuout
        uses: actions/checkout@v2

      # ①アプリケーションをビルドする。
      - name: Install Packages And Build The Application
        run: cd ./path/to/your/hosting/app && npm i && npm run build
        env:
          CI: false

      # ②Hostingにデプロイ
      - name: Deploy to Hosting
        uses: w9jds/firebase-action@master
        with:
          args: deploy --only hosting --project=${{ secrets.PROJECT_ID_STG }}
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
          PROJECT_PATH: "cd ./path/to/your/firebase.json/directory" # firebase.jsonが存在するディレクトリへのパス

      # ③Cloud Functionsのコードに必要なpackageをinstall
      - name: Install Packages for Cloud Functions
        run: cd ./path/to/your/functions/app && npm i
        env:
          CI: false

      # ④Cloud Functionsにデプロイ
      - name: Deploy to Cloud Functions
        uses: w9jds/firebase-action@master
        with:
          args: deploy --only functions --project=${{ secrets.PROJECT_ID_STG }}
        env:
          FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
          PROJECT_PATH: "cd ./path/to/your/firebase.json/directory" # firebase.jsonが存在するディレクトリへのパス

주의점

코드의 ③, ④에서 각각의 코드를 firebase에 배포할 때 firebase.json이 어디에 배치되어 있는지가 중요해진다.
리포지토리의 루트에 firebase.json이 없으면 위의 코드와 같이 환경 변수 PROJECT_PATH에 .firebase.json이있는 디렉토리에 대한 경로를 제공해야합니다.
반대로 루트에 있으면 생략 가능.
출처: 이번에 이용하는 action: htps : // 기주 b. 코 m / 마 r tp ぁ세 / 아 c 치 온 s / 기테 브 아 치 온 - 푸 r

2단계. 각 배포 대상에 대해 다른 환경 변수를 Github Secrets 설정

GithubActions에서 사용할 수 있는 환경 변수를 Github의 Secrets로 설정합니다.
secrets는 저장소 설정의 Secrets 탭에서 설정할 수 있습니다.

firebase 프로젝트 Id를 secrets로 설정

firebase에서는 프로젝트별로 id가 설정되어 있으며, 이것을 배포 명령을 사용할 때 --project에 전달하여 지정한 프로젝트에 배포할 수 있습니다.
위 코드에서 --project=${{ secrets.PROJECT_ID_STG }} 부분
확인하면 임의의 이름으로 등록한다.
이 프로젝트 ID는 배포 대상 프로젝트마다 다르므로 각각 확인하여 별도의 이름 HOGE_STG과 HOGE_PROD 등으로 등록하는 것이 좋습니다.

확인 방법은 이하.

firebase의 프로젝트 ID 확인

firebase 프로젝트 Id는 장치의 다음 위치에서 확인할 수 있다.


또는 커맨드 라인에서 프로젝트 목록을보고 확인할 수 있습니다.

firebase projects:list

firebase의 자격 증명 토큰을 secrets에 등록

배포를 실행할 때 인증 토큰이 필요하므로 등록합니다.
코드의 다음 부분

env:
 FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}

인증 토큰을 얻는 방법

다음 명령을 터미널에서 실행하면 얻을 수 있습니다.

firebase login:ci

실행하면, 브라우저가 일어나, Google 로그인과 인증의 허가를 요구되므로 로그인해 허가한다. 그러면 터미널에 TOKEN이 지불되므로 복사하여 secrets에 임의의 이름으로 등록한다


이상.
그리고 위의 yaml이 포함된 코드를 push(merge)하면 Firebase Hosting과 Cloud Functions에 자동으로 배포된다.

참고

GitHub Action for Firebase

GitHub Actions에서 Nuxt 앱을 Hosting 및 Functions에 배포