无法在下一个 js 上读取 firebase 中未定义的属性“长度" [英] Cannot read property 'length' of undefined in firebase on next js

问题描述

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

I am using firebase in next js but it gives an error message as

TypeError:无法读取未定义的属性长度"无论如何我可以解决这个错误.

TypeError: Cannot read property 'length' of undefined Any way how i can fix this error.

这是我的 Firebase 配置文件

Here is my firebase config file

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};

这是错误信息

.nextserverpagesindex.js (12:13) @ Object../firebasec.js

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

Package.json 文件

Package.json file

{
  "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"
  }
}

推荐答案

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

It seems your code has firebase v8 while you have firebase v9 package and it has completely different import structures. This happen lot when you follow some tutorials with v8 and install firebase so it get latest version on default that's v9

你应该怎么做:

1- 删除当前版本

npm rm firebase

2- 安装最新的 8.x

2- install latest of 8.x

npm install firebase@8.9

这篇关于无法在下一个 js 上读取 firebase 中未定义的属性“长度"的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！