Next.js & Firebase -> TypeError：无法读取未定义的属性（读取“应用程序”）

Question

我想要做的是编写身份验证代码。 使用 NextJS 和 Firebase。

现在问题出现在我的 firebaseClient.js 中，我收到错误“TypeError: Cannot read properties of undefined (reading 'apps')”。

代码如下所示：

import firebase from "firebase/app";

import "firebase/auth";
import "firebase/database";

const FIREBASE_CONFIG = {
  // config files from firebase here
};

export default function firebaseClient() {
  if (!firebase.apps.length) {
    firebase.initializeApp(FIREBASE_CONFIG);
  }
}

在控制台中我收到此错误：终端错误

这出现在 localhost:3000: Error Page on localhost:3000

我在这里关注这个 YT 教程，它是从 2020 年开始的，所以据我所知，一些导入发生了变化。

Answer 1

您的代码似乎有 firebase v8 而您有 firebase v9 package 并且它具有完全不同的导入结构。 当您使用 v8 遵循一些教程并安装 firebase 时，这种情况会发生很多，因此默认情况下它会获得最新版本，即 v9

你该怎么办：

1-删除当前版本

npm rm firebase

2-安装最新的 8.x

npm install firebase@8.9

Answer 2

所以@Chemi Adel 提出的答案实际上是不同版本的问题，在本教程中，他显示了我得到的完全相同的错误，在这段视频中，他将他的代码升级到了 Firebase 的 v9，所以这应该会有所帮助。