无法在下一个 js 上读取 firebase 中未定义的属性“长度”

Posted 2023-03-06

【中文标题】无法在下一个 js 上读取 firebase 中未定义的属性“长度”

【英文标题】：Cannot read property 'length' of undefined in firebase on next js

【发布时间】：2021-12-09 13:34:43

【问题描述】：

我在下一个 js 中使用 firebase，但它给出了一个错误消息

TypeError：无法读取未定义的属性“长度” 无论如何我可以解决这个错误。

这是我的 Firebase 配置文件

import * as firebase from "firebase/app";
import 'firebase/firestore'
const firebaseConfig = 
  apiKey: "AIzaSyD0Kz7iRs6WKSXO6Iw2hEeDFeRcDGERmV8",
  authDomain: "facebook-clone-1870b.firebaseapp.com",
  projectId: "facebook-clone-1870b",
  storageBucket: "facebook-clone-1870b.appspot.com",
  messagingSenderId: "924586129038",
  appId: "1:924586129038:web:1d4204813a4956bd353bdf"
;

const app = !firebase.apps.length
    ? firebase.initializeApp(firebaseConfig)
    : firebase.app();

const db = app.firestore();
const storage = firebase.storage();

export  db,storage;

这是错误信息

.next\server\pages\index.js (12:13) @ Object../firebasec.js

  10 | ;
  11 | 
> 12 | const app = !firebase.apps.length
     |             ^
  13 |     ? firebase.initializeApp(firebaseConfig)
  14 |     : firebase.app();

Package.json 文件

  "name": "my-app",
  "version": "0.1.0",
  "private": true,
  "scripts": 
    "dev": "next dev",
    "build": "next build",
    "start": "next start",
    "lint": "next lint"
  ,
  "dependencies": 
    "@heroicons/react": "^1.0.4",
    "firebase": "^9.1.3",
    "next": "11.1.2",
    "next-auth": "^3.29.0",
    "react": "17.0.2",
    "react-dom": "17.0.2"
  ,
  "devDependencies": 
    "autoprefixer": "^10.3.7",
    "eslint": "7.32.0",
    "eslint-config-next": "11.1.2",
    "postcss": "^8.3.11",
    "tailwindcss": "^2.2.17"
  

【问题讨论】：

package.json 上的 Firebase 版本是什么？

firebase 版本是 9.1.3

【参考方案1】：

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

你应该怎么做：

1- 删除当前版本

npm rm firebase

2- 安装最新的 8.x

npm install firebase@8.9

【讨论】：

@Jeevan 不客气，接受并投票会很好