-
Notifications
You must be signed in to change notification settings - Fork 401
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Cannot connect to the emulators, (FirebaseError: Expected type 'Firestore$1', but it was: a custom Firestore object) #490
Comments
@curiosbasant does this error still happen if you import from
If it's still an issue with the main packages, please let us know. |
This error is still there, when I first start the application. After doing few refreshes it gets automatically resolved (just randomly). :( |
@curiosbasant This is what I did to avoid this error message:
|
@angelroma - is there a working example of how you got this to work? I get the same error. |
Also ran into the same issue trying to connect an emulator
|
It may be a limitation in how connectFirestoreEmulator is working, and/or Im not super in depth with each of the application lifecycles. I was able to resolve my issue @shalomsam / @curiosbasant by wrapping the setup in use effect to await for component init on app
I believe this is more an issue with firebase than reactfire |
@aageorge @shalomsam This is what I'm currently doing to get rid of this issue, as @angelroma's solution didn't work for me. import { app, auth, firestore } from "../firebase/client"
export default function MyApp({ Component, pageProps }: AppProps) {
return (
<FirebaseAppProvider firebaseApp={app}>
<FirebaseSDKProviders>
<ThemeProvider>
<Component {...pageProps} />
</ThemeProvider>
</FirebaseSDKProviders>
</FirebaseAppProvider>
)
}
function FirebaseSDKProviders({ children }) {
return (
<AuthProvider sdk={auth}>
<FirestoreProvider sdk={firestore}>{children}</FirestoreProvider>
</AuthProvider>
)
} And in import { getApp, getApps, initializeApp } from "firebase/app"
import { connectAuthEmulator, getAuth } from "firebase/auth"
import { connectFirestoreEmulator, getFirestore } from "firebase/firestore"
import { __DEV__ } from "../constants"
if (!getApps().length) {
const app = initializeApp({
// firebase project options
})
const auth = getAuth(app),
firestore = getFirestore(app)
if (typeof window != "undefined" && __DEV__) {
console.info("Dev Env Detected: Using Emulators!")
const firebaseConfig = require("../../firebase.json")
if (auth.emulatorConfig?.host !== "localhost")
connectAuthEmulator(auth, `http://localhost:${firebaseConfig.emulators.auth.port}`, {
disableWarnings: true,
})
// @ts-ignore
if (!firestore._settings?.host.startsWith("localhost"))
connectFirestoreEmulator(firestore, "localhost", firebaseConfig.emulators.firestore.port)
}
}
export const app = getApp()
export const auth = getAuth(app)
export const firestore = getFirestore(app) |
This currently suffers from firebase/firebase-js-sdk#6019 and FirebaseExtended/reactfire#490, as well as an unrelated NextJS error.
make sure that u're using firebase/firestore or firebase/firestore/lite in all your firebase imports, is u' can't get data from db using both libs, for example if you: import { getFirestore } from "firebase/firestore"; So, use only one lib, it works for me |
@usuarez Yes I'm totally aware of that. And I can confirm that is not the case. |
@usuarez hei thanks for pointing to this issue, this was the mistake for me... Why in the world autoimport works in first place for |
@usuarez Thanks! I had this issue because of that too |
@usuarez's comment #490 (comment) about mixing Another is by accidentally importing two different versions of the |
Version info
React:
17.0.2
Firebase:
9.5.0
ReactFire:
4.2.1
Other (e.g. Node, browser, operating system) (if applicable):
Node16, Chrome, MacOS
Steps to reproduce
I'm using nextjs, in the
pages/_app.tsx
paste the following codeExpected behavior
I should be able to connect to the emulator, without any error
Actual behavior
Right now it is giving me this error, "FirebaseError: Expected type 'Firestore$1', but it was: a custom Firestore object"
The text was updated successfully, but these errors were encountered: