firestore.collection is not a function

Question

this is my firebase.js

import { initializeApp } from "firebase/app";

import { getFirestore } from "firebase/firestore";

import { getAuth } from "firebase/auth";
import { getAnalytics, logEvent, isSupported } from "firebase/analytics";

//  Update the config
var firebaseConfig = {
  // ...Update config
 
};

// Initialize Firebase

const app = initializeApp(firebaseConfig);
const firestore = getFirestore(app);
const auth = getAuth();
const analytics = getAnalytics(app);

// Uncomment the following if you want to use emulator
// if (process.env.NODE_ENV === "development") {
//   firestore.useEmulator("localhost", 8080);
//   auth.useEmulator("http://localhost:9099");
// }

export { app, firestore, auth, analytics };

And this is how I am using it in one of my components-

import { app, firestore, auth } from "../../firebase";

  const linksPathRef = useMemo(
    () => firestore.collection("users").doc(userUid).collection("links"),
    [userUid]
  );

But I'm getting firestore.collection is not a function ERROR. Not sure, where I am going wrong.

firebase version that is installed in the project "firebase": "^9.6.1"

Answer 1

As the commenters have pointed out, you're using the older API syntax while you're importing the v9 SDK.

The message is about this line

firestore.collection("users").doc(userUid).collection("links")

In the new modular syntax, that should be:

collection(firestore, "users", userUid, "links")

I recommend reading the Firestore documentation again, and checking out this upgrade guide.