如何解决Firebase 9 + Nuxt 3中的“组件认证尚未注册”错误

chhqkbe1  于 2023-05-01  发布在  其他
关注(0)|答案(1)|浏览(184)

我正在开发一个在线商店,并试图通过Firebase实现Google OAuth。我已经成功集成了Firebase服务,如存储和Firestore,但当我尝试将Firebase Auth添加到我的Nuxt 3应用程序时遇到错误。具体地说,我得到了一个“Component auth hasn 't been registered yet”错误

[nitro] [dev] [unhandledRejection] Error: Component auth has not been registered yet                     06:35:21
    at Provider.initialize (/Users/swanandkadam/Desktop/Work/underground/@firebase/component:233:19)
    at initializeAuth (file:///Users/swanandkadam/Desktop/Work/underground/node_modules/@firebase/auth/dist/node-esm/totp-abcc15a3.js:2947:27)
    at Module.getAuth (file:///Users/swanandkadam/Desktop/Work/underground/node_modules/@firebase/auth/dist/node-esm/totp-abcc15a3.js:6575:18)
    at setup (/Users/swanandkadam/Desktop/Work/underground/pages/Login.vue:25:33)
    at _sfc_main.setup (/Users/swanandkadam/Desktop/Work/underground/pages/Login.vue:52:23)
    at callWithErrorHandling (/Users/swanandkadam/Desktop/Work/underground/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:171:22)
    at setupStatefulComponent (/Users/swanandkadam/Desktop/Work/underground/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7194:29)
    at setupComponent (/Users/swanandkadam/Desktop/Work/underground/node_modules/@vue/runtime-core/dist/runtime-core.cjs.js:7149:11)
    at renderComponentVNode (/Users/swanandkadam/Desktop/Work/underground/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:628:17)
    at renderVNode (/Users/swanandkadam/Desktop/Work/underground/node_modules/@vue/server-renderer/dist/server-renderer.cjs.js:755:22)

我已经尝试删除node_modules文件夹,package-lock。json,并使用npm install重新安装,正如我在Github上看到的那样,这可以修复这个问题。然而,这对我来说并不起作用。
为了进一步研究,我创建了一个新的Nuxt 3应用程序,专门用于测试Firebase Auth。然而,我仍然遇到同样的错误,即使我没有编写任何其他代码或安装除了Firebase之外的任何其他包。

我的堆栈:

Nuxt 3 Firebase 9

Package.json文件

{
  "name": "nuxt-app",
  "private": true,
  "scripts": {
    "build": "nuxt build",
    "dev": "nuxt dev",
    "generate": "nuxt generate",
    "preview": "nuxt preview",
    "postinstall": "nuxt prepare"
  },
  "devDependencies": {
    "@types/node": "^18",
    "nuxt": "^3.4.2"
  },
  "dependencies": {
    "firebase": "^9.12.0"
  }
}

firebase.js文件

import { initializeApp } from "firebase/app";
import { getAuth } from "firebase/auth";

// TODO: Replace the following with your app's Firebase project configuration
// See: https://firebase.google.com/docs/web/learn-more#config-object
const firebaseConfig = {
  //... ( hidden for security purposes )

};

// Initialize Firebase
const app = initializeApp(firebaseConfig);
// Initialize Firebase Authentication and get a reference to the service
const auth = getAuth(app);
export default auth;

任何帮助是高度赞赏。
预期成果:在我的在线商店中成功实施Firebase Auth for Google OAuth。
实际结果:在尝试将Firebase Auth添加到我的Nuxt 3应用程序时遇到“Component auth had not been registered yet”错误,无论是在我的主项目还是在一个专门为测试Firebase Auth而创建的新项目中。

toiithl6

toiithl61#

我今天遇到了同样的错误,找到了一个解决方案here基本上你只需要重命名你的“firebase”。js”to“firebase.client.js”。这对我来说很有用。我希望这也对你有帮助!
干杯

相关问题