Estoy usando firebase en next js pero da un mensaje de error como

TypeError: no se puede leer la propiedad 'longitud' de indefinido De cualquier manera, puedo solucionar este error.

Aquí está mi archivo de configuración de 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};

Aquí hay un mensaje de error

 .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();

Archivo paquete.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" } }