预期 collection() 的第一个参数是 CollectionReference、DocumentReference 或 FirebaseFirestore

Question

i have been solving this issue since past 2 days but cant get any idea of how it is solved

const handleSignUp = () => {
    auth
    .createUserWithEmailAndPassword(email, password)
    .then(userCredentials => {
      console.log(userCredentials.user.uid)
      const user = userCredentials.user;
      console.log('Registered with:', user.email);
      
      setDoc(doc(db, "users", "LA"), {
        name: "Los Angeles",
        // state: "CA",
        // country: "USA"
      });

      })
      .catch(error => alert(error.message))
  }

The Firebase module is here if it need any changes of any dependency or any version please suggest as firebase version is 9.6.11,while firestore is of 3.4.14

// Import the functions you need from the SDKs you need
// import  firebase from "firebase";
// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

import firebase from "firebase/compat/app";
import "firebase/compat/auth";
import "firebase/compat/firestore";
import "firebase/compat/database"
// import { getFirestore } from "@firebase/firestore";
import { getFirestore } from 'firebase/firestore'

// import { getFirestore } from 'firebase/firestore/lite'


const firebaseConfig = {
  apiKey: ........................
  authDomain: ........................
  projectId: ........................
  storageBucket: ........................
  messagingSenderId: ........................
  appId: ........................
};

// Initialize Firebase
let app;
if (firebase.apps.length === 0) {
  app = firebase.initializeApp(firebaseConfig);
} else {
  app = firebase.app()
}

export const auth = firebase.auth()
// export const db = firebase.firestore();
export const db = getFirestore(app)

Answer 1

The error indicates that you are calling setDoc() function to something that is not a DocumentReference or a CollectionReference.
You may try to get the details from the console log as to which variable reference it is hitting the above error and understand why what you are calling it on is not a valid CollectionReference or DocumentReference. Please read through the helpful documentation for Collection Reference
The function setDoc(),writes to the document referred to by the specified DocumentReference. If the document does not yet exist, it will be created. If you provide merge or mergeFields, the provided data can be merged into an existing document.The result of this write will only be reflected in document reads that occur after the returned promise resolves. If the client is offline, the write fails. If you would like to see local modifications or buffer writes until the client is online, use the full Firestore SDK.
Also check and verify that you are to call the firebase admin sdk rather than the client SDK and see if that works.

Answer 2

It's an AngularFire version issue, basically if you're using Angular 12, with Firebase 9 you need @angular/fire@^7.0

The compatibility table on the firebase page is key: https://github.com/angular/angularfire#angular-and-firebase-versions

I struggled with this issue for hours?days? and it was because I had angularfire 7.4 (even 7.2 didn't work).