视图2；在“firebase/app”中找不到导出“default”（作为“firebase”导入）

Question

我正在尝试在 Vue 2 应用程序中导入 firebase，但遇到了这个烦人的问题。

我的进口看起来像：

import firebase from 'firebase/app'
import 'firebase/auth'
import 'firebase/firestore'

但当我提供它时，我得到：

在“firebase/app”中找不到导出“default”（作为“firebase”导入）

...我的视图不会渲染或路由。

我的 firebase 版本是 npm 的 9.0.0。

Answer 1

由于 Firebase SDK 版本 9 于 2021 年 8 月 25 日发布，许多使用 Firebase Web SDK 版本 8 的用户都遇到了同样的问题。

根据文档，当前使用 Firebase Web SDK 版本 8 或更早版本的应用程序应考虑迁移到版本 9，如下所示：

之前：版本 8（旧）

import firebase from 'firebase/app';
import 'firebase/auth';
import 'firebase/firestore';

之后：版本 9 兼容（新）

// v9 compat packages are API compatible with v8 code
import firebase from 'firebase/compat/app';
import 'firebase/compat/auth';
import 'firebase/compat/firestore';

Answer 2

由于 Doug Stevenson 建议检查我的 firebase 版本，我最终检查了 firebase 的升级文档并发现了此 https://firebase.google.com/docs/web/modular-upgrade

按照那里的说明（将路径从 firebase/x 更改为 firebase/compat/x）完美解决了我的问题。谢谢大家，我希望像我这样对新格式感到困惑的其他无知的人可以通过这篇文章得到帮助。

Answer 3

根据 firebase 文档：将导入更新为 v9 兼容。为了在将依赖项从 v8 更新到 v9 beta 后保持代码正常运行，请将导入语句更改为使用每个导入的 \xe2\x80\x9ccompat\xe2\x80\x9d 版本。\n例如:

\n

之前：版本 8

\n

import firebase from 'firebase/app';\nimport 'firebase/auth';\nimport 'firebase/firestore';\nimport "firebase/database";\nimport "firebase/storage";\n

\n

之后：版本 9 compat\n// v9 compat 软件包与 v8 代码的 API 兼容

\n

import firebase from 'firebase/compat/app';\nimport 'firebase/compat/auth';\nimport 'firebase/compat/firestore';\nimport "firebase/compat/database";\nimport "firebase/compat/storage";\n

\n