如何配置Firebase实现切换项目后一键部署对应Hosting站点？

场景说明 #

你有两个Firebase项目（production和testing），已通过Firebase CLI完成登录并可通过firebase use testing切换项目；托管内容存放在hosting目录下，已创建两个站点：

• production项目中的join站点
• testing项目中的join-tst站点

当前firebase.json仅配置了join-tst站点，希望实现类似Cloud Functions的部署体验：切换项目后执行firebase deploy --only hosting即可自动部署到对应项目的站点，无需手动指定站点名称。

解决方案 #

1. 修改firebase.json配置 #

在hosting数组中添加第二个配置项，通过project字段绑定对应Firebase项目，site字段绑定对应站点。修改后的配置如下：

{
  "hosting": [
    {
      "project": "production",
      "site": "join",
      "public": "hosting",
      "cleanUrls": true,
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "redirects": [
        {
          "source": "/",
          "destination": "https://mywebsite.com/",
          "type": 301
        }
      ],
      "headers": [
        {
          "source": "/.well-known/*",
          "headers": [
            {
              "key": "Content-Type",
              "value": "application/json"
            }
          ]
        }
      ]
    },
    {
      "project": "testing",
      "site": "join-tst",
      "public": "hosting",
      "cleanUrls": true,
      "ignore": [
        "firebase.json",
        "**/.*",
        "**/node_modules/**"
      ],
      "redirects": [
        {
          "source": "/",
          "destination": "https://mywebsite.com/",
          "type": 301
        }
      ],
      "headers": [
        {
          "source": "/.well-known/*",
          "headers": [
            {
              "key": "Content-Type",
              "value": "application/json"
            }
          ]
        }
      ]
    }
  ]
}

注：project字段的值需与你Firebase CLI中设置的项目别名/项目ID一致，可通过firebase projects:list查看当前关联的项目。

2. 部署操作 #

切换到目标项目后直接执行部署命令即可：

# 部署到测试环境
firebase use testing
firebase deploy --only hosting

# 部署到生产环境
firebase use production
firebase deploy --only hosting

Firebase CLI会根据当前激活的项目，自动匹配firebase.json中对应project字段的hosting配置，部署到绑定的站点，无需手动指定站点名称。

可选优化 #

如果两个站点的配置大部分相同，可通过Firebase CLI的环境配置减少重复代码：

• 创建环境配置文件（如.env.production、.env.testing）
• 使用firebase functions:config:set设置公共配置，在hosting配置中通过占位符引用（需结合构建工具处理）

不过对于简单场景，直接复制配置项是最直观的方案。

内容的提问来源于stack exchange，提问作者Dominik Roszkowski