Flutter Web项目部署Firebase Hosting后页面无法正常显示问题求助

你遇到的异常页面为Firebase默认的初始化欢迎页，可按以下步骤逐一排查解决：

• 检查firebase init阶段的公共目录配置
  执行初始化命令时需指定公共目录为Flutter Web编译产物的输出路径，默认路径为项目根目录下的build/web。如果误选了Firebase默认的public目录，部署后就会显示默认欢迎页。如果配置错误可以直接修改项目根目录下的firebase.json文件，将hosting.public字段的值修改为build/web即可。

• 确认部署前已完成Flutter Web生产编译
  每次部署前必须先执行flutter build web命令生成最新的生产环境静态产物，未执行该步骤会导致build/web目录下没有有效应用文件，或者仍为旧版本代码。编译完成后可以先在本地打开build/web/index.html确认页面功能正常，再执行部署操作。

• 校验单页应用重写规则配置
  Flutter Web属于单页应用，需要配置所有访问路径重定向到index.html才能保证路由正常工作，请确认firebase.json的hosting配置下包含如下规则：

  "rewrites": [
    {
      "source": "**",
      "destination": "/index.html"
    }
  ]
  

  错误的重定向、缓存规则也会导致页面加载异常，配置异常时可清空firebase.json的hosting相关配置后重新执行firebase init。

• 部署后清除浏览器缓存访问
  浏览器可能缓存了之前的默认页面，部署完成后可按下Ctrl+Shift+R强制刷新页面，或者使用无痕模式访问确认是否恢复正常。

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