javascript - 动态加载 firebase 模块？ (v9)

Question

我使用的是最新的 Firebase 版本 9，我正在尝试优化加载时间。一种方法是仅在需要时动态加载 firebase 模块，而不是等待所有模块加载完毕。例如，仅当用户单击退出按钮时，才从 'firebase/auth' 导入 signOut() 函数。这个策略行得通吗？我正在努力在 firebase 9 上实现它。有可用的示例吗？

到目前为止我已经尝试过:

index.js: 下面的代码没有运行，显然是 webpack 无法编译(错误:top-level-await experiment is not enabled)

let {signOut, signInAnonymously, etc.} = await import('firebase/auth');

Answer 1

错误信息非常清楚:除非你在你的 webpack 配置中明确允许它，否则不能在顶级代码中使用 await 关键字。

也就是说，您不需要在 import 语句中使用 await，因为这已经在构建期间同步处理了。如 Firebase 中的示例所示 documentation喜欢:

import { getAuth, signInAnonymously } from "firebase/auth";

所以在你的情况下，使用:

import { signOut, signInAnonymously } from 'firebase/auth');