即使调用了initializeApp，也未创建“没有Firebase应用程序”[默认]”

Question

我正在尝试将Firebase（Firestore）添加到我的Nuxt项目中，但是在初始化Firebase中的常量时，我收到了以下错误。firestore（）在我的索引中。vue文件：

未捕获的Firebase错误：Firebase：未创建Firebase应用程序[DEFAULT]-调用Firebase App.initializeApp（）（app/no-app）。

我已经在我的项目中安装了Firebase，还安装了模块（@nuxtjs/Firebase）。

我的nuxt。配置。js文件如下所示：

export default {

...

plugins: ['~/plugins/firebase.js'],

components: true,

buildModules: [
    '@nuxt/typescript-build',
    '@nuxtjs/tailwindcss',
],

modules: [],

...

}

我的firebase.js文件在我的插件文件夹中，如下所示：

import firebase from 'firebase/app'

const config = {
    ...
}

let app = null
if (!firebase.apps.length) {
    app = firebase.initializeApp(config)
}

export default firebase

我已经将上述内容与其他在线示例进行了比较，没有发现任何问题。然而，从Nuxt到Firebase，我都是新手，所以我可能遗漏了一些明显的东西。感谢您的任何建议。




Answer 1

在初始化firebase之前尝试访问firestore时，通常会发生这种情况。因此，默认情况下，我们可以检查firebase是否由firebase初始化。应用程序。长度，但每次初始化firebase都不是一个好的做法。

因此，如果您只使用fiRecovery，那么在您的插件中，您可以在初始化后直接导出fiRecovery，如下所示，

import firebase from 'firebase/app'

const config = {
    ...
}

let app = null
if (!firebase.apps.length) {
    app = firebase.initializeApp(config)
}

export default firebase.firestore()

但由于您使用的是nuxt，因此有一个名为firebase/nuxt的特殊nuxt包

安装后，您可以在模块部分内的nuxt config中定义您的配置如下所示，

modules: [
    [
      '@nuxtjs/firebase',
      {
        config: {
          apiKey: '<apiKey>',
          authDomain: '<authDomain>',
          databaseURL: '<databaseURL>',
          projectId: '<projectId>',
          storageBucket: '<storageBucket>',
          messagingSenderId: '<messagingSenderId>',
          appId: '<appId>',
          measurementId: '<measurementId>'
        },
        services: {
          auth: true // Just as example. Can be any other service.
        }
      }
    ]
  ],

我认为在nuxt中使用firebase是一种更好的方法。js公司

Answer 2

根据GitHub的讨论，这是firebase的一段代码。js应工作：

import fb from "firebase/app"
export const firebase = !fb.apps.length ? fb.initializeApp(firebaseConfig) : fb.app()

// somecomponent.js
import {firebase} from "../firebase.js"

// do your firebase stuff here

将其职位归功于@Brunocrosier；尽管这段代码不区分大小写，但为了完整起见，我决定将其包括在内。

除此线程外，一般来说，未捕获的Firebase错误：Firebase：未创建Firebase应用程序“[默认]”—请调用Firebase应用程序。initializeApp（）（应用程序/无应用程序） 通常是调用firebase的结果 初始化前通过。初始化EAPP（） 或调用。在firebase应用程序中多次初始化app（）（例如，Next.js可能会尝试在后端初始化，也可能在前端初始化，这在您的代码中似乎是这样）。

因此，作为一种解决方案，我强烈建议将您的初始化移动到firebase。js文件，以便在应用程序启动时直接对其进行初始化。

为了进一步阅读：

• nuxt/firebase文档

Answer 3

如果您在单个Firebase应用程序上多次调用firalizeApp（），通常会发生这种情况。如果您使用的是单个Firebase db，请确保在您的应用程序启动时对其进行初始化。