angularfire: ERROR in node_modules/angularfire2/auth/auth.d.ts(10,20): error TS2503: Cannot find namespace 'firebase'.

Angular: 5.0

Firebase: 4.8.1

AngularFire: 5.0.0-rc.4

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

How to reproduce these conditions

Steps to set up and reproduce

Follow the Installation & Setup guide in the agunlarfire 2 github

Sample data and security rules

<-- include/attach/link to some json sample data (or provide credentials to a sanitized, test Firebase project) -->

Debug output

** Errors in the JavaScript console **

** Output from firebase.database().enableLogging(true); **

** Screenshots **

ERROR in node_modules/angularfire2/auth/auth.d.ts(10,20): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/auth/auth.d.ts(11,36): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(5,45): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(8,17): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(9,21): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(10,22): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(11,20): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firebase.app.module.d.ts(13,22): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(8,43): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(9,46): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(9,80): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(10,49): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(10,95): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(10,140): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(10,182): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(11,49): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(11,94): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/changes.d.ts(11,130): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(8,54): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(8,96): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(10,19): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(12,22): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(12,69): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(13,27): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(14,25): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(15,30): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(16,27): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/collection/collection.d.ts(17,27): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/document/document.d.ts(8,10): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/document/document.d.ts(9,22): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/document/document.d.ts(10,28): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/document/document.d.ts(14,42): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/firestore.d.ts(9,55): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/firestore.d.ts(12,25): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(4,11): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(5,14): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(14,37): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(14,80): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(16,10): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/interfaces.d.ts(17,12): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(6,41): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(6,80): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(7,41): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(7,98): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(8,48): error TS2503: Cannot find namespace ‘firebase’. node_modules/angularfire2/firestore/observable/fromRef.d.ts(8,93): error TS2503: Cannot find namespace ‘firebase’.

Expected behavior

Project compiles successfully

Actual behavior

The project doesn’t compile

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 35
  • Comments: 89 (13 by maintainers)

Commits related to this issue

Most upvoted comments

@rts-cwalker The same happened to me.

Changing it to firebase 4.8.0 fixed the issue as stated in the other thread.

Solution:

1. Inside package.json, remove ^ from "firebase": "^4.8.1" 1.1 Downgrade Firebase from 4.8.1 to 4.8.0 by changing 4.8.1 to 4.8.0 1.2 End result should look like this: "firebase": "4.8.0" 2. Run npm update in the Project Root. NPM will downgrade Firebase for ya 3. Run ng serve --open to check for compilation errors. There shouldn’t be any. 4. Enjoy!

Reason:

Firebase had introduced some breaking changes that AngularFire2 had not coped up with yet. Until the AngularFire2 team work it out, this will be the solution.

Add a thumbs up emoji and direct anyone having the same trouble here! Would save a lot of their time!

Go back to firebase 4.8.0:

  1. In your CLI with you project path type: npm uninstall firebase (which is 4.8.1)
  2. then once finished uninstall, type: npm cache clear
  3. -then type: npm install firebase@4.8.0
  4. -finally: Remove “firebase”: “^4.8.1” in dependencies in package.json and Type “firebase”: “4.8.0” (Note: without ^). Save All and your problem will be solved! 😃

@a-cordoba10 Make sure you dont have a leading ^ in front of the 4.8.0 in package.json for firebase. Also there is an angularfire2 v5.0.0-rc.5 available that may help. I made both of these changes and it works for me now

Can we get a warning next before breaking changes come in…

Whats just as shocking is that its released as a “patch” release… Breaking changes should AT LEAST be minor version release.

4.8.1 was a refactor of the typings and you now pull your imports from @firebase:

import { FirebaseApp } from '@firebase/app-types';
import { FirebaseAuth } from '@firebase/auth-types';
import { FirebaseDatabase } from '@firebase/database-types';
import { FirebaseMessaging } from '@firebase/messaging-types';
import { FirebaseStorage } from '@firebase/storage-types';
import { FirebaseFirestore } from '@firebase/firestore-types';

I found this, maybe we can make some update ?

Just to keep everyone up to date, we have a fix in the works but it probably won’t be released until next week. Keep on 4.8.0 right now.

@Sandeep3005 did you uninstall the prior firebase version before changing to use firebase: 4.8.0? I made sure to run npm uninstall --save firebase and then ran npm install with firebase: 4.8.0. Although if you already updated to 4.8.0 in package.json, I wouldnt add the --save flag to npm uninstall

So the steps I followed were: npm uninstall --save firebase npm install --save firebase@4.8.0 Remove the leading ^ in front of resulting package version for firebase

Fixed in the latest release.

“angularfire2”: “5.0.0-rc.5”, and “firebase”: “4.8.0” did work for me 😃

@Etosticity work correctly

Solution:

  1. Inside package.json, remove ^ from “firebase”: “^4.8.1” 1.1 Downgrade Firebase from 4.8.1 to 4.8.0 by changing 4.8.1 to 4.8.0 1.2 End result should look like this: “firebase”: “4.8.0”
  2. Run npm update in the Project Root. NPM will downgrade Firebase for ya
  3. Run ng serve --open to check for compilation errors. There shouldn’t be any.

Reason:

Firebase had introduced some breaking changes that AngularFire2 had not coped up with yet. Until the AngularFire2 team work it out, this will be the solution.

Add a thumbs up emoji and direct anyone having the same trouble here! Would save a lot of their time!

This worked for me: I uninstalled all the old versions from the project and I updated the package.json with the following structure, after that I npm installed and it worked fine.

The reason it is not working is because angularFire2 is trying to get the namespace from /firebase which in the version 4.8.1 changed to /@firebase.

Hope it work for you guys,

“dependencies”: { “@angular/animations”: “^5.0.0”, “@angular/common”: “^5.0.0”, “@angular/compiler”: “^5.0.0”, “@angular/core”: “^5.0.0”, “@angular/forms”: “^5.0.0”, “@angular/http”: “^5.0.0”, “@angular/platform-browser”: “^5.0.0”, “@angular/platform-browser-dynamic”: “^5.0.0”, “@angular/router”: “^5.0.0”, “angularfire2”: “^5.0.0-rc.5”, “core-js”: “^2.4.1”, “firebase”: “4.8.0”, “rxjs”: “^5.5.2”, “zone.js”: “^0.8.14” }

“angularfire2”: “5.0.0-rc.5”, and “firebase”: “4.8.0” did not work yet. 😦

I started getting this error last night as well out of the blue. I even reran builds that has just completed successfully that then failed with no changes.

I think this new error may be related to the firebase refactoring specified in the latest comments in angular/angularfire2#1385

There is a PR open for this issue. https://github.com/angular/angularfire2/pull/1386

Updating both fixed it for me. This may help someone.

    "angularfire2": "^5.0.0-rc.6",
    "firebase": "^4.9.1",

I am still getting the same error on “firebase”: “^5.0.3”, “angularfire2”: “^5.0.0-rc.9”,

spent many days trying to fix this. Disappointed to hear that it was a release issue. Downgrading to firebase 4.8.0 from 4.8.1 fixed it for me

The fix for new people like me:

Go to your terminal:

in your app directory -> open package.json with your editor of choice (VSCODE in my case) change “firebase”: “^4.8.1” to “firebase”: “4.8.0” command s to save then in your terminal type-> npm install

you don’t have to type update or uninstall because npm should do it for you. in your editor make a note that you changed it so that someday if you have to come back to it you know you changed it.

//changed from “firebase”: “^4.8.1” on 12-29-17 you will be glad you did.

That does fix it.

I am having bad time with this error

@rts-cwalker thanks, I don’t see that, Can’t believe they release breaking change in xmas

Im building locally, but now im getting this error when building my auth service

ERROR in …/…/…/node_modules/@firebase/database/dist/esm/src/api/Database.d.ts(4,33): error TS2307: Cannot find module ‘@firebase/app-types/private’. …/…/…/node_modules/@firebase/database/dist/esm/src/core/AuthTokenProvider.d.ts(17,39): error TS2307: Cannot find module ‘@firebase/app-types/private’.

I have “angularfire2”: “5.0.0-rc.4”, and “firebase”: “4.8.1”, (Downgrading to firebase “4.8.0”) and after npm install I Worked here.

Be sure on your package.json file that the firebase and angularfire2 version doesn’t have the ^ symbol, otherwise you will be importing version 4.8.1 not 4.8.0.:

uninstall and reinstall firebase 4.8.0

On a Christmas, breaking changes!!! I tried below and it worked. “angularfire2”: “5.0.0-rc.4”, “firebase”: “4.8.0”,

Be sure on your package.json file that the firebase version doesn’t have the ^ symbol, otherwise you will be importing version 4.8.1 not 4.8.0.:

"angularfire2": "^5.0.0-rc.5",
"firebase": "4.8.0",

this resolution doesnt work for me.

“dependencies”: { “@angular/common”: “5.0.3”, “@angular/compiler”: “5.0.3”, “@angular/compiler-cli”: “5.0.3”, “@angular/core”: “5.0.3”, “@angular/forms”: “5.0.3”, “@angular/http”: “5.0.3”, “@angular/platform-browser”: “5.0.3”, “@angular/platform-browser-dynamic”: “5.0.3”, “@ionic-native/core”: “4.4.0”, “@ionic-native/splash-screen”: “4.4.0”, “@ionic-native/status-bar”: “4.4.0”, “@ionic/pro”: “1.0.16”, “@ionic/storage”: “2.1.3”, “@types/firebase”: “^2.4.32”, “angularfire2”: “^5.0.0-rc.4”, “firebase”: “4.8.0”, “ionic-angular”: “3.9.2”, “ionicons”: “3.0.0”, “promise-polyfill”: “^6.1.0”, “rxjs”: “5.5.2”, “sw-toolbox”: “3.6.0”, “zone.js”: “0.8.18” }

Firebase really should have done this refactor this at a SemVer major point since it is going to break everyone’s TypeScript builds. Instead they did it between 4.8.0 and 4.8.1.

finally !!! i know the problem and could fix it with a downgrade to 4.8.0

The following combination is working for me: $npm install --save firebase@5.0.3 angularfire2@5.0.0-rc.10 “angularfire2”: “^5.0.0-rc.10”, “firebase”: “^5.0.3”,

@arashbi Looks like they released 5.0.0-rc.10 the day after you posted. The following combination is working for me:

"angularfire2": "^5.0.0-rc.10",
"firebase": "^5.0.3",

I restored my package.json to "firebase": "^4.8.0" (which imports 4.8.2) and my project compiles with no issue. Issue resolved!

Hi All,

Can any body tell me how to fix the same thing in Ionic2 project

I have tried every thing which you mentioned above but no luck.

Still i am getting the same issue

Cannot find module ‘@firebase/app-types/private’. Users/vyas/node_modules/@firebase/database/dist/esm/src/api/Database.d.ts

Cannot find module ‘@firebase/app-types/private’. …rs/vyas/node_modules/@firebase/database/dist/esm/src/core/AuthTokenProvider.d.ts

My package.json - after i downgraded the firebase “angularfire2”: “5.0.0-rc.4”, “firebase”: “4.8.0”,

confirmed it is 4.8.1 is a breaking one.

@matew17 Good catch! Didn’t realize that 😂

“angularfire2”: “^5.0.0-rc.5”, “firebase”: “4.8.0”,

Worked for me… I don’t know why there are so many breaking changes these days.

Step1 – Downgrade firebase to 4.8.0 and remove ^, Step2-- Remove ^ from “angularfire2”: “5.0.0-rc.4”,

Step3-- run npm update and restart your VSCODE

“dependencies”: { “@angular/common”: “5.0.3”, “@angular/compiler”: “5.0.3”, “@angular/compiler-cli”: “5.0.3”, “@angular/core”: “5.0.3”, “@angular/forms”: “5.0.3”, “@angular/http”: “5.0.3”, “@angular/platform-browser”: “5.0.3”, “@angular/platform-browser-dynamic”: “5.0.3”, “@firebase/firestore”: “^0.2.2”, “@firebase/webchannel-wrapper”: “0.2.5”, “@ionic-native/core”: “4.4.0”, “@ionic-native/splash-screen”: “^4.5.2”, “@ionic-native/status-bar”: “4.4.0”, “@ionic/pro”: “1.0.16”, “@ionic/storage”: “2.1.3”, “angularfire2”: “5.0.0-rc.4”, “cordova-android”: “6.3.0”, “cordova-plugin-device”: “^1.1.7”, “cordova-plugin-ionic-webview”: “^1.1.16”, “cordova-plugin-splashscreen”: “^4.1.0”, “cordova-plugin-whitelist”: “^1.3.3”, “cordova-splashscreen”: “^3.1.0”, “firebase”: “4.8.0”, “ionic-angular”: “3.9.2”, “ionic-plugin-keyboard”: “^2.2.1”, “ionicons”: “3.0.0”, “promise-polyfill”: “^6.1.0”, “rxjs”: “5.5.2”, “sw-toolbox”: “3.6.0”, “zone.js”: “0.8.18”

If I try angularfire2@5.0.0-rc.5 without the ^ I get:

No matching version found for angularfire2@5.0.0-rc.5

Is only me?

@darlondjc , did you ran npm update on the root folder? I was missing that step

Upgrading angularfire2 and downgrading firebase fixed it for me. “angularfire2”: “5.0.0-rc.5”, + “firebase”: “4.8.0”,

“dependencies”: { “@angular/animations”: “^5.0.0”, “@angular/common”: “^5.0.0”, “@angular/compiler”: “^5.0.0”, “@angular/core”: “^5.0.0”, “@angular/forms”: “^5.0.0”, “@angular/http”: “^5.0.0”, “@angular/platform-browser”: “^5.0.0”, “@angular/platform-browser-dynamic”: “^5.0.0”, “@angular/router”: “^5.0.0”, “@angular/service-worker”: “^5.0.0”, “@ngrx/store”: “^4.1.1”, “angularfire2”: “5.0.0-rc.5”, “core-js”: “^2.4.1”, “firebase”: “4.8.0”, “rxjs”: “^5.5.2”, “zone.js”: “^0.8.14” },

@hiepxanh there is already a PR open to fix. #1386