Flutter Web部署Firebase Hosting后仅显示Setup Complete窗口求助

问题描述 #

使用VS Code开发Flutter Web项目，通过以下命令部署到Firebase Hosting：

firebase init hosting
flutter build web
firebase deploy

首次部署完全正常，但后续修改项目重新部署后，访问Hosting URL仅显示Firebase Hosting Setup Complete默认页面，而非实际项目内容。执行过程及项目代码均无报错，当前firebase.json配置如下：

{
  "hosting": {
    "public": "build/web",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ],
    "rewrites": [
      {
        "source": "**",
        "destination": "/index.html"
      }
    ]
  }
}

已尝试以下方案但均未解决：

• 修改firebase.json重定向配置为build/web
• 执行firebase hosting:disable清理缓存
• 执行firebase deploy --only hosting重新部署
• 重新执行flutter build web
• 更新Firebase CLI
• 使用Ctrl+F5清除浏览器缓存
• 检查Firebase Hosting日志

解决方案 #

1. 确认构建产物的有效性 #

• 手动删除项目根目录下的build文件夹，执行flutter build web --release重新构建生产版本
• 打开build/web/index.html，确认文件内容包含你项目的自定义代码（而非Firebase默认页面内容）
• 本地启动静态服务器测试构建产物：

  # Python3
  python -m http.server 8000 --directory build/web
  # 或使用npm工具
  npx serve build/web
  

  访问http://localhost:8000，若本地仍显示异常，说明构建过程存在问题，需排查Flutter Web配置（如web/index.html是否被篡改、pubspec.yaml配置是否正确）

2. 核对Firebase Hosting配置一致性 #

• 登录Firebase控制台，进入对应项目的Hosting页面，查看「部署设置」中的「公共目录」是否为build/web，重写规则是否与本地firebase.json一致
• 若控制台配置与本地不符，执行firebase deploy同步本地配置到云端

3. 强制刷新Firebase边缘缓存 #

• 在Firebase控制台Hosting页面的「部署历史记录」中，选择最新部署版本，点击「刷新缓存」并选择「全部缓存」
• 或使用CLI命令强制推送最新版本：

  firebase hosting:channel:deploy live --force
  

4. 确认Firebase项目关联正确性 #

• 执行firebase use查看当前CLI关联的项目ID，若不是目标项目，执行firebase use <你的项目ID>切换后重新部署
• 检查是否误部署到预览通道，确认访问的是生产环境URL

内容的提问来源于stack exchange，提问作者amr khaled