如何让Firebase Hosting预部署按目标执行？多站点预览求助

核心问题原因 #

Firebase CLI在一次性部署多个Hosting目标时，会先依次执行所有目标的predeploy脚本，再统一开始部署所有站点。这就导致后面的cp .env.site-x .env会覆盖前面生成的.env，最终所有站点都用最后一个target对应的.env文件，自然无法正常工作。

解决方案：拆分站点部署流程 #

不要一次性指定多个target，而是在Github Action中为每个站点单独执行部署步骤，让每个站点的predeploy、构建、部署流程完全独立，避免.env文件被覆盖。

具体Github Action配置示例 #

可以用两种方式实现：

方式1：为每个站点写独立步骤

直接在workflow里为每个target单独添加部署步骤：

name: Firebase Multi-Site Preview Deploy
on:
  pull_request:
    branches: [main]

jobs:
  deploy-previews:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'

      - name: Install Dependencies
        run: npm ci

      # 部署site-a
      - name: Deploy site-a Preview
        uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "${{ secrets.GITHUB_TOKEN }}"
          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_YOUR_PROJECT }}"
          projectId: your-firebase-project-id
          target: site-a
          preview: true

      # 部署site-b
      - name: Deploy site-b Preview
        uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "${{ secrets.GITHUB_TOKEN }}"
          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_YOUR_PROJECT }}"
          projectId: your-firebase-project-id
          target: site-b
          preview: true

      # 部署site-c
      - name: Deploy site-c Preview
        uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "${{ secrets.GITHUB_TOKEN }}"
          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_YOUR_PROJECT }}"
          projectId: your-firebase-project-id
          target: site-c
          preview: true

方式2：用矩阵策略简化配置

如果站点数量多，用Github Action的矩阵（matrix）来批量处理，减少重复代码：

name: Firebase Multi-Site Preview Deploy
on:
  pull_request:
    branches: [main]

jobs:
  deploy-previews:
    runs-on: ubuntu-latest
    strategy:
      matrix:
        target: [site-a, site-b, site-c]
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node.js
        uses: actions/setup-node@v4
        with:
          node-version: 20
          cache: 'npm'

      - name: Install Dependencies
        run: npm ci

      - name: Deploy ${{ matrix.target }} Preview
        uses: FirebaseExtended/action-hosting-deploy@v0
        with:
          repoToken: "${{ secrets.GITHUB_TOKEN }}"
          firebaseServiceAccount: "${{ secrets.FIREBASE_SERVICE_ACCOUNT_YOUR_PROJECT }}"
          projectId: your-firebase-project-id
          target: ${{ matrix.target }}
          preview: true

方案有效性说明 #

每个部署步骤都是独立执行的：

1. 每个步骤会先触发对应target的predeploy脚本（复制对应的.env文件）
2. 接着完成当前站点的构建和部署
3. 下一个步骤重新开始，复制自己的.env，不会和上一个站点的流程冲突

这样每个站点都会使用自己对应的.env文件进行构建和部署，完美解决覆盖问题。

内容的提问来源于stack exchange，提问作者Iori Kojima