TypeError: _Firebase__WEBPACK_IMPORTED_MODULE_6__.db.collection is not a function firebase

Question

` import { initializeApp, getApps } from 'firebase/app'; import { getStorage } from 'firebase/storage';

const firebaseConfig = { apiKey: 'key', authDomain: 'facebook-clone-nextjs-2dcc9.firebaseapp.com', projectId: 'facebook-clone-nextjs-2dcc9', storageBucket: 'facebook-clone-nextjs-2dcc9.appspot.com', messagingSenderId: '662489031143', appId: '1:662489031143:web:ae71393e61a214e3f35d42', measurementId: 'G-VFB246J0M5', };

const firebaseApp = initializeApp(firebaseConfig);

const db = getStorage(firebaseApp);

export { db };

const sendpost = (e) => { e.preventDefault(); if (!inputRef.current.value) return;

    db.collection('post').add({
        message: inputRef.current.value,
        name: session.user.name,
        email: session.user.email,
        image: session.user.image,
        timestamp: firebase.firestore.fieldValue.serverTimestamp(),
    });
    inputRef.current.value = '';

};

`

Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. — Community♦

Dharmaraj Dharmaraj · Accepted Answer · 2021-09-02T12:55:33

The issues are:

You are using modular SDK so you cannot use db.collection()
You should use getFirestore to get an instance of Firestore but you are using getStorage which will get an instance of Storage.

Try refcatoring your code to this:

import { getFirestore, collection } from "firebase/firestore"

const db = getFirestore(app)

const colRef = collection(db, "posts")

await addDoc(colRef, {
  ...yourDataObject
});

You can learn more about the new syntax in the documentation

TypeError: _Firebase__WEBPACK_IMPORTED_MODULE_6__.db.collection is not a function firebase

1 Answers