Firebase Typescript initialization isse

Viewed 154

I am trying to add firebase to a typescript app, but am having issues with the initial configuration. I have set the google side of the equation up and am using that in the config. Nonetheless, I am having issues:

import firebase from "firebase/app";
import "firebase/database";

// TODO: Add SDKs for Firebase products that you want to use
// https://firebase.google.com/docs/web/setup#available-libraries

// Your web app's Firebase configuration
const firebaseConfig = {
  //fields below purposefully redacted
  apiKey: "",
  authDomain: "",
  projectId: "",
  storageBucket: "",
  messagingSenderId: "",
  appId: "",
};

// Initialize Firebase
firebase.initializeApp(firebaseConfig);

export default firebase.database(firebaseConfig["appId"]);

Error:

Property 'database' does not exist on type 'typeof import("c:////Documents/GitHub//node_modules/firebase/app/dist/app/index")'.ts(2339)

Below are pics of the issue:

code snippet

Error message

1 Answers

If you are using V9.0.0+ then you should upgrade to new Modular Syntax which looks like this:

import { initializeApp } from "firebase/app"
import { getDatabase } from "firebase/database"

const app = initializeApp({...config})

const db = getDatabase(app)

export { db }

Make sure you are using the new syntax everywhere else in the code. Refer the documentation to learn more about the new syntax.

If you wish to use the older name-spaced syntax (as in most of the older tutorials), use the compat version:

import firebase from "firebase/compat/app";
import "firebase/compat/database";
// import "firebase/compat/[SERVICE_NAME]"
Related