CODEWITHSUNDEEP
firebasevue.jsgoogle-cloud-firestorevuefire
Ke_Sandaru
Ke_Sandaru

Reputation: 149

'Uncaught TypeError: firebaseApp.firestore is not a function' when integrating Firebase to Vue.js 2

I get this error when inspecting

Uncaught TypeError: firebaseApp.firestore is not a function.

Used dependencies:

"vuefire": "^3.0.0-alpha.2"

"firebase": "^9.0.2"

my db.js file:

import * as Firebase from "firebase/app";
import 'firebase/firestore';
import { initializeApp } from "firebase/app";

const firebaseApp = Firebase.initializeApp({
      apiKey: "x***************************",
      authDomain: "a**********.firebaseapp.com",
      projectId: "f****demo-****",
      storageBucket: "f**********.appspot.com",
      messagingSenderId: "2***********",
      appId: "1:**********:web:2**************"
});
export const db = initializeApp(firebaseApp.firestore());

How the error get solved?

Upvotes: 2

Views: 2454

Answers (1)

samthecodingman
samthecodingman

Reputation: 26306

In v9 of the Firebase SDK the API surface changed to using modular, tree-shakeable code. Expect pretty much every piece of documentation or example code you see to have been written for v8 or older Firebase SDK versions that need updating.

Read more about migrating here.

For your specific case, you need to use the getFirestore() method, passing in the relevant FirebaseApp instance:

import { getFirestore } from "firebase/firestore";

export const db = getFirestore(firebaseApp);

Although, because this is the default unnamed instance, you can also just use:

import { getFirestore } from "firebase/firestore";

export const db = getFirestore();

Upvotes: 4

Related Questions