angularfire: AngularFire is not compatible with Firebase JS SDK v8

Version info

Angular: v10.2.0

Firebase: v8.0.0

AngularFire: v6.0.3

Other (e.g. Ionic/Cordova, Node, browser, operating system):

Debug output

ERROR in node_modules/@angular/fire/auth/auth.d.ts:4:10 - error TS2614: Module '"../../../firebase"' has no exported member 'User'. Did you mean to use 'import User from "../../../firebase"' instead?
4 import { User, auth } from 'firebase/app';
           ~~~~
node_modules/@angular/fire/auth/auth.d.ts:4:16 - error TS2614: Module '"../../../firebase"' has no exported member 'auth'. Did you mean to use 'import auth from "../../../firebase"' instead?
4 import { User, auth } from 'firebase/app';

Expected behavior

There should be no errors.

About this issue

Original URL
State: closed
Created 4 years ago
Reactions: 16
Comments: 18 (7 by maintainers)

Commits related to this issue

update angular and firebase libraries - see https://github.com/angular/angularfire/issues/2619 — committed to bdunklau/g2t by deleted user 4 years ago

Most upvoted comments

I still can’t get auth and User by importing firebase/app. It just says it doesn’t have an exported member User and auth.

firebase version: 8.2.0 AngularFire version: 6.1.4 Angular version: 11.0.5

+11

Reprevise on Dec 17, 2020

@jamesdaniels Sorry for the absence. I tested 6.0.4 with firebase@7 and it does not work. In firebase@8 it does work though.

Here’s my analysis.

In firebase@7, the firebase is export as such:

export = firebase;

So, to be able to use import firebase from 'firebase'; in AngularFire’s codebase, the user needs to have allowSyntheticDefaultImports set as true in their tsconfig.json.

But in 6.0.4 type definition, there is one line that is problematic. Here:

https://unpkg.com/browse/@angular/fire@6.0.4/storage/observable/fromTask.d.ts

The import("firebase").default.storage.UploadTaskSnapshot does not play very well with "allowSyntheticDefaultImports": true. Hence, there is this error while building a project with 6.0.4 and firebase@7:

ERROR in node_modules/@angular/fire/storage/observable/fromTask.d.ts:3:83 - error TS2694: Namespace 'firebase' has no exported member 'default'.
3 export declare function fromTask(task: UploadTask): Observable<import("firebase").default.storage.UploadTaskSnapshot>;

Please take a look. I’m not sure why the generated .d.ts is using the import() type syntax, though.

+11

sarunint on Nov 1, 2020

Ah yeah, they just changed the API in v8 firebase.User is the same thing auth.User used to be.

jamesdaniels on Dec 22, 2020

I have :

import firebase from 'firebase/app';
import 'firebase/auth'

I can use firebase.User but not firebase.auth.User …

QuentinFarizon on Dec 22, 2020

For those - like me - who arrive here from Google: the docs have a pretty concise summary (https://github.com/angular/angularfire/blob/master/docs/auth/getting-started.md)

AlexanderLea on Feb 22, 2021

Releasing 6.0.4 with support for v8 later today.

jamesdaniels on Oct 30, 2020

I am still having the same problem. Angular version 11.0.2 and AngularFire version 6.1.1

dusanradojcic00 on Nov 20, 2020

Give 6.0.4-canary.9a26fbe a spin, I’ll be releasing 6.0.4 final shortly.

jamesdaniels on Oct 30, 2020