next.js Import * as firebase from 'firebase/app'返回undefined

jdgnovmf  于 2023-06-22  发布在  其他
关注(0)|答案(2)|浏览(119)

我试图在Next.js项目上使用firebase v9,但每当我导入它时,它似乎返回undefined。

import * as firebase from 'firebase/app'

export function getFirebaseApp() {
  const clientCredentials = { ... }
  return firebase.initializeApp(clientCredentials)
}

但是,当我尝试在浏览器中运行这个时,我得到的只是这个错误:

TypeError: Cannot read property 'initializeApp' of undefined

这种情况发生在导入的任何变体中,我已经尝试了几种:

import * as firebase from 'firebase/app'
import firebase from 'firebase/app'
import { initializeApp } from 'firebase/app'

// and the same thing importing from '@firebase/app' instead, though don't think that'd ever work

我真的不知道发生了什么,我不认为这是Next.js的问题,因为即使是VSCode也不建议从firebase导入任何东西,即使它已经安装(我可以在node_modules中看到)。我在package.json中有这行:

{
  "dependencies": {
    "firebase": "^9.0.2"
  }
}

所以这是一个谜,我真的不知道发生了什么。任何建议我如何解决这个问题?

编辑:由于我已经收到了两条建议,我想我会把它放在这里:

我正在使用模块化SDK,所以我尝试直接导入initializeApp,但仍然不起作用:

import { initializeApp } from 'firebase/app'

export function getFirebaseApp() {
  const clientCredentials = { ... }
  return initializeApp(clientCredentials)
}
TypeError: Cannot read properties of undefined (reading 'initializeApp')
ugmeyewa

ugmeyewa1#

您可以安装firebaseuinext版本,它将与新SDK一起工作:

npm i -S firebaseui@next

并将其集成到您的应用程序中,如here
如果您使用compat版本,您将无法享受新SDK的好处。
正如在github问题中所说的,两个库不会很快更新,所以做这一点努力并100%转移到新的SDK将是值得的。

kzipqqlq

kzipqqlq2#

我找到了问题的根源。我正在使用react-firebaseui-不幸的是,它不支持模块化版本的firebase(尚未)。因此,解决方案是使用其他东西,或者使用compat库:

import firebase from 'firebase/compat/app'

相关问题