WHY Server Error TypeError: Cannot read properties of undefined (reading 'length') in NextJS

mystic77 0
Viewed 25

Why the component is rendering correctly but the browser console throws this error? How to solve this problem

in firebase.js

    import * as firebase from "firebase/app"

const firebaseConfig = {
    apiKey: "my api code",
    authDomain: "mywebsitename.firebaseapp.com",
    projectId: "mywebsitenameid",
    storageBucket: "mywebsitename",
    messagingSenderId: "senderid",
    appId: "appid"
  };

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

  const db = app.firebase()

export { db };
next-auth next.js firebase reactjs
1 Answers

Since you are using NextJs, I am assuming you are using the Firebase Module and not the Firebase CDN.

I am also going to assume you are using Firebase V9 or greater since you are not importing from .../compat/app.

From The Docs, the correct way to initialize a Firebase app is as follows:

import { initializeApp } from 'firebase/app';
import { getFirestore, collection, getDocs } from 'firebase/firestore/lite';
// Follow this pattern to import other Firebase services
// import { } from 'firebase/<service>';

// TODO: Replace the following with your app's Firebase project configuration
const firebaseConfig = {
  //...
};

const app = initializeApp(firebaseConfig);

const db = getFirestore(app);
Rafael Zasas0
Related