Missing types on firebase auth lib

Issue

For some reason I can't seem to find the appropriate types for firebase.

When creating a fresh project in typescript, e.g. npx create-react-app test --template typescript, and after installing both firebase and @types/firebase, I get a:

Property 'auth' does not exist on type 'typeof import("/Users/username/test/node_modules/firebase/app/dist/app/index")'.

When trying to call it as:

import * as firebase from "firebase/app";

firebase.auth();

I also tried with:

• import firebase from "firebase/app"; // Same error as above
• import firebase from "firebase"; // Cannot find module 'firebase' or its corresponding type declarations.
• Adding a import "firebase/auth" as suggested in some docs, but nothing

I'm on latest versions, and so:

"firebase": "^9.1.0", // Dependency
"@types/firebase": "^3.2.1" // Dev dependency

Can it be I perhaps need to install a different @types/ package? Or perhaps the two versions contain mismatched typings?

Solution

You are not using the new Modular Syntax which was introduced from V9.0.0. The new syntax looks like:

import { initializeApp } from "firebase/app"
import { getAuth } from "firebase/auth"

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

const auth = getAuth(app)

export { auth }

If you want to use existing name-spaced syntax, then you can use compat versions:

import firebase from "firebase/compat/app"
import "firebase/compat/auth"

I'd recommend following the upgrading to new Modular syntax and following the documentation which has examples of both the syntaxes. Also checkout this Firecast to learn more about the new SDK.

Answered By - Dharmaraj