Flutter Web端release构建时Firebase无法正常运行问题咨询

你在index.html中使用带type="module"属性的脚本执行Firebase初始化，模块脚本默认是异步延迟执行的。Flutter Web release模式构建时，main.dart.js会被高度压缩，加载和执行速度远快于debug模式，会早于Firebase初始化脚本执行完成，因此Dart侧调用await Firebase.initializeApp()时，还没有默认的Firebase实例被创建，就会触发你遇到的报错。debug模式下Dart代码未压缩、执行速度慢，刚好可以等到模块脚本初始化完成，因此不会出现问题。

1. 最简单的修复方式是去掉Firebase初始化脚本的type="module"属性，让它变成同步执行脚本，保证在main.dart.js加载执行前完成Firebase初始化，修改后的index.html对应代码如下：

<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-analytics.js"></script>
<!--<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>-->
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
<script>
  const firebaseConfig = {
    apiKey: "___",
    authDomain: "___",
    projectId: "___",
    storageBucket: "___",
    messagingSenderId: "___",
    appId: "___",
    measurementId: "____"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
  firebase.firestore();
</script>

2. 修复后执行flutter clean清空本地构建缓存，再重新执行release构建命令验证即可。
3. 如果你后续需要适配多平台统一初始化，也可以升级到最新版FlutterFire套件，直接在Dart侧传入Firebase配置完成初始化，无需在index.html中手动引入Firebase SDK和编写初始化代码，可从根源避免这类加载顺序问题。

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