Solvedangularfire Build error: This module is declared with using 'export ='

785

After updating to v6.0.4 from v6.0.3 I am getting the following error - This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.

Setting allowSyntheticDefaultImports: true gives the following error:

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>;
                                                                                    ~~~~~~~

Version info

Angular:

10.2.1

Firebase:

7.24.0

AngularFire:

6.0.4

How to reproduce these conditions

Steps to set up and reproduce

Update to 6.0.4

Debug output

N/A

Log stack

ERROR in node_modules/@angular/fire/firebase.app.module.d.ts:2:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    2 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/auth-guard/auth-guard.d.ts:4:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    4 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/auth/auth.d.ts:4:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    4 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/auth/auth.d.ts:12:14 - error TS2411: Property 'authState' of type 'Observable<any>' is not assignable to string index type 'Promise<any> & ((...args: unknown[]) => Promise<any>) & ((...args: unknown[]) => any)'.
    
    12     readonly authState: Observable<firebase.User | null>;
                    ~~~~~~~~~
    node_modules/@angular/fire/auth/auth.d.ts:16:14 - error TS2411: Property 'idToken' of type 'Observable<string>' is not assignable to string index type 'Promise<any> & ((...args: unknown[]) => Promise<any>) & ((...args: unknown[]) => any)'.
    
    16     readonly idToken: Observable<string | null>;
                    ~~~~~~~
    node_modules/@angular/fire/auth/auth.d.ts:20:14 - error TS2411: Property 'user' of type 'Observable<any>' is not assignable to string index type 'Promise<any> & ((...args: unknown[]) => Promise<any>) & ((...args: unknown[]) => any)'.
    
    20     readonly user: Observable<firebase.User | null>;
                    ~~~~
    node_modules/@angular/fire/auth/auth.d.ts:26:14 - error TS2411: Property 'idTokenResult' of type 'Observable<any>' is not assignable to string index type 'Promise<any> & ((...args: unknown[]) => Promise<any>) & ((...args: unknown[]) => any)'.
    
    26     readonly idTokenResult: Observable<firebase.auth.IdTokenResult | null>;
                    ~~~~~~~~~~~~~
    node_modules/@angular/fire/firestore/interfaces.d.ts:2:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    2 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/firestore/collection/collection.d.ts:2:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    2 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/firestore/document/document.d.ts:5:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    5 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/firestore/collection-group/collection-group.d.ts:2:8 - [39m[91merror TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    2 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/firestore/firestore.d.ts:9:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    9 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/storage/interfaces.d.ts:1:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    1 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/storage/storage.d.ts:6:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    6 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    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>;
                                                                                        ~~~~~~~
    node_modules/@angular/fire/analytics/analytics.d.ts:3:8 - error TS1259: Module '"/Users/akshayrajgollahalli/Documents/GitHub/lectus-ui/node_modules/firebase/index"' can only be default-imported using the 'allowSyntheticDefaultImports' flag
    
    3 import firebase from 'firebase/app';
             ~~~~~~~~
    
      node_modules/firebase/index.d.ts:9710:1
        9710 export = firebase;
             ~~~~~~~~~~~~~~~~~~
        This module is declared with using 'export =', and can only be used with a default import when using the 'allowSyntheticDefaultImports' flag.
    node_modules/@angular/fire/analytics/analytics.d.ts:17:5 - error TS2411: Property 'updateConfig' of type '(config: Config) => Promise<void>' is not assignable to string index type 'Promise<any> & ((...args: unknown[]) => Promise<any>) & ((...args: unknown[]) => any)'.
    
    17     updateConfig(config: Config): Promise<void>;
           ~~~~~~~~~~~~

30 Answers

Original

✔️Accepted Answer

Soolan

173

I see...

What happens when you add these entries to compilerOptions in tsconfig?

  "compilerOptions": {
    //....
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true
  },

Related Issues:

251

angularfire Missing exported members after updating to Angular 6.0.0

It looks like rxjs-compat is missing Use npm i rxjs-compat to install the missing rxjs-compat. ...

184

angularfire ERROR TypeError: Object(…) is not a function” using AngularFirestore and firebase

@jamesdaniels Yes npm install rxjs@6 rxjs-compat@6 --save It solved the issue. I want to use firebas...

164

angularfire @firebase/firestore: Firestore (5.8.0): timestampsInSnapshots

eg: app.module.ts Version info Angular: 7.2.1 Firebase: 5.8.0 AngularFire: 5.1.1 In the newest fireb...

142

angularfire 5.2.1 AngularFireAuthGuard causes TypeError: source.lift is not a function

I worked in this way Performing basic docs for AngularFireAuthGuard produces an error related to sou...

angularfire Just get the value once with no subscription

Use .take(1) which will kill the subscription once the first value has emitted. ...

angularfire [ERROR] Class 'FirebaseApp' incorrectly implements interface 'App'

Just to be super clear $ ionic cordova run browser Running app-scripts build: --platform browser --t...

angularfire Build error: This module is declared with using 'export ='

I see.. What happens when you add these entries to compilerOptions in tsconfig? ...

angularfire How to order by date?

Hey guys I just implemented a solution also to this using the mapping function this will return an O...

angularfire Namespace 'firebase' has no exported member 'Promise'.

Hey @dauledk! firebase.Promise was removed in version 4.5.0 of the firebase SDK Now you just use a r...

angularfire CollectionReference.doc function path should be optional

I agree this should align with the Firebase SDK A potential workaround is to use a pattern like this...

angularfire Cannot find namespace 'firebase'.

I am using angularfire2 in an ionic 2 project and I was getting the same error With the new angularf...

angularfire Firebase Storage is not working with ionic 3 & AngularFire 4.0.0 rc

Hey guys I was having this same problem but getting an issue where it was saying that my Firebase ap...

angularfire Calling AngularFireFunctions.httpsCallable results to error 404 because

The issue seems to come from #1920 (this file) resolving #1874 To get around it for now you can do t...

angularfire auth.login() Error "location.protocol" must be http or https

does it make sense to add some Help Wanted! or other label to raise the importance/severity? looks l...

angularfire Ducumentation Issues

@Anystrous Update: I see the problem The docs need this fix: We had breaking changes in version 5.0 ...

angularfire Cannot read property 'FacebookAuthProvider' of undefined - 2.0.0-beta.5

@arielcessario this works for me too as a workaround Hello Since I have updated my angularfire2 to t...

angularfire automaticDataCollectionEnabled' is missing in type 'FirebaseApp'

Same issue solved as suggested above.. At first Version info Angular: 5.2.9 Firebase: ^4.13.0 Angula...

angularfire Angular Ivy 9.0 stable and angularfire RC1 using Firestore have trouble with Universal

I am aiming to achieve success bundling us with Angular 9 SSR within a week Depending on the day of ...

angularfire Unhandled Promise rejection: this._next is not a function : Zone in @angular/fire/messaging

this worked for me: When I am receiving firebase push notifications in the foreground by using @angu...

angularfire Feature Request: Official version to delete a collection and all nested documents

There's no angularfire version You'd have to access the native Firestore SDK references: The above e...

angularfire FireStore timestampsInSnapshots

you can try but i dont know if it work : and comment: AngularFirestoreModule.enablePersistence() ...

angularfire Module '"/node_modules/angularfire2/angularfire2"' has no exported member 'AngularFireModule'.

@lfarroco @DMPS Can you try the pre-release version? I am trying to use the latest version of Angula...

angularfire How do I iterate through FirebaseListObservable<[]> object

Hi As this.users will get its data asynchronously from firebase you're likely trying to iterate befo...

angularfire AngularFire is not compatible with Firebase JS SDK v8

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

angularfire Can't run npm install angularfire2 firebase --save

I believe this issue is due to the latest version of firebase is now 4.0.0 but angularfire2@4.0.0-rc...

angularfire signInWithCredential error code auth/network-request-failed

Hi I have had the same problem with signInWithCredential which returns an error code auth/network-re...

angularfire Server Error. certificate has expired

I'm not super familiar with AngularFire but I'm pretty sure I found the issue ** Screenshots ** Expe...

angularfire Uncaught Error: "location.protocol" must be http or https when building to device using Ionic 2 & Angular 2

here is a project where I am running into issues - https://github.com/aaronksaunders/ionic2-angularf...

885

components Error: mat-form-field must contain a MatFormFieldControl.

You have to add to app.module.ts: Bug feature request or proposal: When doing a karma/jasmine test I...

608

angular Angular5.x lazyLoad problem, undefined is not a function

For others that find this issue via Google as i did: I had the same problem when trying to lazy load...

348

angular Cyclic dependency error with HttpInterceptor

I resolved simply not setting authService in constructor but getting in the intercept function. ...

286

angular cli Issue: Cannot read property 'thisCompilation' of undefined

Here is the answer from issues #9793 : npm remove webpack npm install webpack@3.11.0 ...

277

angular Uncaught Error: Can't resolve all parameters for ...

You are missing an @Injectable() annotation on your ApiService Support requests like these should li...

275

ngx bootstrap fix(tooltip): tooltip flickering when hover the mouse on the border on the tooltip position

Add pointer-events: none; to the tooltip css problem solved! .tooltip { pointer-events: none; } ...

266

angular Force reload/refresh current route with RouteReuseStrategy

Hi If you really need to trick the Router into reloading the component on each routerLink click ...

260

angular Misleading error message "Cannot find a differ supporting object '[object Object]'"

I just ran into the same issue I'm not sure if the recommended solution will work for my case ...

255

angular cli Error | Could not find plugin "proposal-numeric-separator" | Generating ES5 bundles for differential loading

Try to install @babel/compat-data: ~7.8.0 to devDependencies This is the only workaround which helpe...

246

sheetjs How to simply export a Worksheet to xlsx?

There are two issues: each object is mapped to a row so if you want a row with name John and city Se...

236

angular cli Using invalid environment causes error in build (was "ERROR in Cannot read property 'length' of undefined")

Probably not the same cause but we had the same error (Cannot read property 'length' of undefined) w...

232

angular cli ng serve method ip not open in another machines

The solution is simple Just bind to the correct interface address via ng serve --host=0.0.0.0 ...

226

angular cli Incorrect JS paths when ng build -prod is deployed in a subfolder

When you're deploying to non-root path within a domain you'll need to manually update the <base href...

224

angular update 2 to 4 has problem [ts] Property 'map' does not exist on type 'Observable<Response>'.

I met the same problem with the angular cli 6.0.0 and rxjs 6.1.0 And I solved the problem by replaci...

218

angular cli Installation error: permission denied for node-sas

sudo npm install -g --unsafe-perm --verbose @angular/cli Installation error (node-sass) with: node v...

208

angular cli ng build -prod Module not found: Error: Can't resolve './$$_gendir/app/app.module.ngfactory'

Instead of use ng build --prod use ng build --env=prod UPDATE As many of us (thx) have mention this ...

175

storybook Webpack 4 support?

I'm getting the below error when running Storybook with a project using Webpack 4; This is preventin...

173

angular cli Property 'controls' does not exist on type 'AbstractControl'.

Got it! Looked at the docs - FormArray The FormArray class contains the controls property ...

170

angular Angular2 AoT Compiler Errors

pls try /cc @chuckjaz When I try to compile my project with ngc it throws the below error: Error: Er...

167

angular cli [Bug] cli needs to be reloaded when a lazy loaded module is added in routes (FIXED)

I recomended change { path: 'user-panel' loadChildren: './user-panel/user-panel.module#UserPanelModu...

167

prettier Change HTML/JSX formatting to have one attribute/prop per line

The point I am trying to make is that the vertical space matters Wasting it (too much) has negative ...

162

angular cli AOT build fails

I noticed same problem and after npm i enhanced-resolve@3.3.0 I can build with AOT ...