New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Cannot find namespace 'firebase'. #234

Closed
doczoidberg opened this Issue Jun 17, 2016 · 99 comments

Comments

Projects
None yet
@doczoidberg

doczoidberg commented Jun 17, 2016

With the new angularfire I get the error

ERROR in C:\temp\aspnetu\node_modules\angularfire2\database\database.d.ts
(9,29): error TS2503: Cannot find namespace 'firebase'.
ERROR in C:\temp\aspnetu\node_modules\angularfire2\database\database.d.ts
(10,31): error TS2503: Cannot find namespace 'firebase'.
ERROR in C:\temp\aspnetu\node_modules\angularfire2\utils\firebase_object_factory.d.ts
(4,76): error TS2503: Cannot find namespace 'firebase'.
ERROR in C:\temp\aspnetu\node_modules\angularfire2\utils\firebase_list_factory.d.ts
(5,74): error TS2503: Cannot find namespace 'firebase'.
...etc
@LanderBeeuwsaert

This comment has been minimized.

Show comment
Hide comment
@LanderBeeuwsaert

LanderBeeuwsaert Jun 17, 2016

Can you tell me what the solution was for this?

LanderBeeuwsaert commented Jun 17, 2016

Can you tell me what the solution was for this?

@doczoidberg

This comment has been minimized.

Show comment
Hide comment
@doczoidberg

doczoidberg Jun 17, 2016

no solution, but I think the issue has nothing to do with Angularfire2 but with my project template with AngularUniversal and HMR:
aspnet/JavaScriptServices#140

Update: Steve said, that it is a firebase issue. therefore I reopened the issue

doczoidberg commented Jun 17, 2016

no solution, but I think the issue has nothing to do with Angularfire2 but with my project template with AngularUniversal and HMR:
aspnet/JavaScriptServices#140

Update: Steve said, that it is a firebase issue. therefore I reopened the issue

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

Anyone else got the solution for this? I am trying to get angularfire2 working with the 3 SDk.

I have ran

typings install --save --ambient firebase

But I still get this error. I am running this on webpack

joaogarin commented Jun 22, 2016

Anyone else got the solution for this? I am trying to get angularfire2 working with the 3 SDk.

I have ran

typings install --save --ambient firebase

But I still get this error. I am running this on webpack

@doczoidberg doczoidberg reopened this Jun 22, 2016

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

Using the definitely typed version for the typings did not help also. Still getting the same error.

joaogarin commented Jun 22, 2016

Using the definitely typed version for the typings did not help also. Still getting the same error.

@andyfo

This comment has been minimized.

Show comment
Hide comment
@andyfo

andyfo Jun 22, 2016

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

Typings for firebase 3 seem not to be available yet so it doesn't help to install the firebase typings from the global repository.

For me, it helped to include the typings from node_modules/angularfire2 into the typings/main.d.ts file:

/// <reference path="../node_modules/angularfire2/firebase3.d.ts" />

andyfo commented Jun 22, 2016

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

Typings for firebase 3 seem not to be available yet so it doesn't help to install the firebase typings from the global repository.

For me, it helped to include the typings from node_modules/angularfire2 into the typings/main.d.ts file:

/// <reference path="../node_modules/angularfire2/firebase3.d.ts" />
@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

Yeah, I added it to the tsconfig file in files as mentioned in https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md#3-include-firebase-sdk-typings but I still get that error.

joaogarin commented Jun 22, 2016

Yeah, I added it to the tsconfig file in files as mentioned in https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md#3-include-firebase-sdk-typings but I still get that error.

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

I noticed that after the inclusion of firebase3 my error is actually :

Cannot find name 'Firebase'.

And not 'namespace'. Will keep digging

joaogarin commented Jun 22, 2016

I noticed that after the inclusion of firebase3 my error is actually :

Cannot find name 'Firebase'.

And not 'namespace'. Will keep digging

@idesignpixels

This comment has been minimized.

Show comment
Hide comment
@idesignpixels

idesignpixels Jun 22, 2016

Hey also getting this problem :/

idesignpixels commented Jun 22, 2016

Hey also getting this problem :/

@olostan

This comment has been minimized.

Show comment
Hide comment
@olostan

olostan Jun 22, 2016

As temporary workaround you can use this type definitions: https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts

Add into 'typings.json' into globalDependencies this record:
"firebase": "https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts"
and then typings i

olostan commented Jun 22, 2016

As temporary workaround you can use this type definitions: https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts

Add into 'typings.json' into globalDependencies this record:
"firebase": "https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts"
and then typings i

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

In my case I need to get a hold of Firebase() so that I can use https://www.firebase.com/docs/web/api/firebase/authwithcustomtoken.html

authentication with custom tokens. I included the firebase typings but it seems Firebase global is somehow not exposed and typescript complains..

joaogarin commented Jun 22, 2016

In my case I need to get a hold of Firebase() so that I can use https://www.firebase.com/docs/web/api/firebase/authwithcustomtoken.html

authentication with custom tokens. I included the firebase typings but it seems Firebase global is somehow not exposed and typescript complains..

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 22, 2016

Okay. Regarding the error : Cannot find name 'Firebase'.

Firebase global does not exist anymore, so I still had some parts from the 2 SDK where I was doing new Firebase() which now does not exist.so not an issue..

The namespace thing I managed to get across by adding the right typings as mentioned earlier. either by adding it to your tsconfig as described in https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md#3-include-firebase-sdk-typings or via typings (temporarily by the gist given by @olostan for example)

joaogarin commented Jun 22, 2016

Okay. Regarding the error : Cannot find name 'Firebase'.

Firebase global does not exist anymore, so I still had some parts from the 2 SDK where I was doing new Firebase() which now does not exist.so not an issue..

The namespace thing I managed to get across by adding the right typings as mentioned earlier. either by adding it to your tsconfig as described in https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md#3-include-firebase-sdk-typings or via typings (temporarily by the gist given by @olostan for example)

@easierbycode

This comment has been minimized.

Show comment
Hide comment
@easierbycode

easierbycode Jun 22, 2016

after installing the typings via gist or docs I still get the error.
The only fix for me was to change the change the "files" path in tsconfig.json from "../node_modules/angularfire2/firebase3.d.ts" -> "firebase3.d.ts" and copy firebase3.d.ts into my src directory.

I'm not sure why since using "../typings/globals/firebase/index.d.ts" fixed "Cannot find name 'Firebase'" on FB2 version of exact same app.

easierbycode commented Jun 22, 2016

after installing the typings via gist or docs I still get the error.
The only fix for me was to change the change the "files" path in tsconfig.json from "../node_modules/angularfire2/firebase3.d.ts" -> "firebase3.d.ts" and copy firebase3.d.ts into my src directory.

I'm not sure why since using "../typings/globals/firebase/index.d.ts" fixed "Cannot find name 'Firebase'" on FB2 version of exact same app.

@alexweber

This comment has been minimized.

Show comment
Hide comment
@alexweber

alexweber Jun 23, 2016

Hey all, I'm running into similar issues getting this installed in an Ionic2 project. The tsconfig file has some globbing rules that excludes node_modules/ stuff and I think that may be overriding the manual file entry for the firebase typings. Would be great to be able to simply install them from typings or something equivalent.

alexweber commented Jun 23, 2016

Hey all, I'm running into similar issues getting this installed in an Ionic2 project. The tsconfig file has some globbing rules that excludes node_modules/ stuff and I think that may be overriding the manual file entry for the firebase typings. Would be great to be able to simply install them from typings or something equivalent.

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 23, 2016

Yes if the tsconfig is excluding the node_modules then you want to add it to the typings.json file. In that case you can do what suggested by @olostan and do :

Add into 'typings.json' into globalDependencies this record:
"firebase": "https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts"
and then typings i

joaogarin commented Jun 23, 2016

Yes if the tsconfig is excluding the node_modules then you want to add it to the typings.json file. In that case you can do what suggested by @olostan and do :

Add into 'typings.json' into globalDependencies this record:
"firebase": "https://gist.githubusercontent.com/cdcarson/28399c50b02bf6c507fbf5b7b30daa31/raw/fa089d231ca4253d4715f8161efc6af74c972dfa/firebase-sdk-3-typings.d.ts"
and then typings i

@alexweber

This comment has been minimized.

Show comment
Hide comment
@alexweber

alexweber commented Jun 23, 2016

@joaogarin Thanks!

@joaogarin

This comment has been minimized.

Show comment
Hide comment
@joaogarin

joaogarin Jun 23, 2016

No problem.

joaogarin commented Jun 23, 2016

No problem.

@starkiron

This comment has been minimized.

Show comment
Hide comment
@starkiron

starkiron Jun 24, 2016

I followed what was suggested by @olostan however, I am still receiving the error TS2304 cannot find name Firebase. any other suggestions or causes as to why this is persisting?

starkiron commented Jun 24, 2016

I followed what was suggested by @olostan however, I am still receiving the error TS2304 cannot find name Firebase. any other suggestions or causes as to why this is persisting?

@starkiron

This comment has been minimized.

Show comment
Hide comment
@starkiron

starkiron Jun 24, 2016

tried install typings dt~firebase --global --save and it installed firebase 2.4 and the error in the editor was removed but when compiled, I still got the cannot find name Firebase error.

starkiron commented Jun 24, 2016

tried install typings dt~firebase --global --save and it installed firebase 2.4 and the error in the editor was removed but when compiled, I still got the cannot find name Firebase error.

@idesignpixels

This comment has been minimized.

Show comment
Hide comment
@idesignpixels

idesignpixels Jun 27, 2016

Still causing me problems with ionic tried lots of things to work around.

idesignpixels commented Jun 27, 2016

Still causing me problems with ionic tried lots of things to work around.

@fincefid

This comment has been minimized.

Show comment
Hide comment
@fincefid

fincefid Jun 27, 2016

I solve this problem for my Ionic2 project by doing:

Step 1: package.json to contain the following versions

"dependencies": {
  "angularfire2": "^2.0.0-beta.2",
  "firebase": "^3.0.5",
  ...
},
"devDependencies": {
  "ionic-gulp-browserify-typescript": "^2.0.0", (Dunno what you can do for non-Ionic projects)
  ...

Step 2: install typings version 1.0.5 (that might be due to node version i have - v5.12.0)

Step 3: tsconfig.json to contain:

 "files": [
    "node_modules/angularfire2/firebase3.d.ts"
  ],
  "exclude": [
    "node_modules",
    "typings/global",
    "typings/global.d.ts"
  ],

Step 4: typings/index.d.ts

/// <reference path="globals/es6-shim/index.d.ts" />
/// <reference path="../node_modules/angularfire2/firebase3.d.ts" />

fincefid commented Jun 27, 2016

I solve this problem for my Ionic2 project by doing:

Step 1: package.json to contain the following versions

"dependencies": {
  "angularfire2": "^2.0.0-beta.2",
  "firebase": "^3.0.5",
  ...
},
"devDependencies": {
  "ionic-gulp-browserify-typescript": "^2.0.0", (Dunno what you can do for non-Ionic projects)
  ...

Step 2: install typings version 1.0.5 (that might be due to node version i have - v5.12.0)

Step 3: tsconfig.json to contain:

 "files": [
    "node_modules/angularfire2/firebase3.d.ts"
  ],
  "exclude": [
    "node_modules",
    "typings/global",
    "typings/global.d.ts"
  ],

Step 4: typings/index.d.ts

/// <reference path="globals/es6-shim/index.d.ts" />
/// <reference path="../node_modules/angularfire2/firebase3.d.ts" />
@davideast

This comment has been minimized.

Show comment
Hide comment
@davideast

davideast Jun 27, 2016

Member

The solution is using the "files" array in the tsconfig.json file.

 "files": [
    "node_modules/angularfire2/firebase3.d.ts"
  ],

This is stated in the installation and setup section.

Member

davideast commented Jun 27, 2016

The solution is using the "files" array in the tsconfig.json file.

 "files": [
    "node_modules/angularfire2/firebase3.d.ts"
  ],

This is stated in the installation and setup section.

@davideast davideast closed this Jun 27, 2016

@filoxo

This comment has been minimized.

Show comment
Hide comment
@filoxo

filoxo Jun 30, 2016

Contributor

Here's an alternative to fincefid's and davideast's solutions above because

the "files" property cannot be used in conjunction with the "exclude" property 1

which might be problematic for some setups. This worked for me with an Ionic v2 project.

Instead of modifying tsconfig.json, you can reference the Firebase 3 typings file that is included in the angularfire2 node package directly in your typings.json. Run:

  • typings install file:node_modules/angularfire2/firebase3.d.ts --save --global
    • this saves the reference into typings.json
    • NOTE: requires typings v.1+
  • typings install
    • this puts the typings files in the typings/ directory.
Contributor

filoxo commented Jun 30, 2016

Here's an alternative to fincefid's and davideast's solutions above because

the "files" property cannot be used in conjunction with the "exclude" property 1

which might be problematic for some setups. This worked for me with an Ionic v2 project.

Instead of modifying tsconfig.json, you can reference the Firebase 3 typings file that is included in the angularfire2 node package directly in your typings.json. Run:

  • typings install file:node_modules/angularfire2/firebase3.d.ts --save --global
    • this saves the reference into typings.json
    • NOTE: requires typings v.1+
  • typings install
    • this puts the typings files in the typings/ directory.
@dmastag

This comment has been minimized.

Show comment
Hide comment
@dmastag

dmastag Jul 1, 2016

Contributor

@filoxo did not know you can install typings directly from the node_modules like that 👍

Contributor

dmastag commented Jul 1, 2016

@filoxo did not know you can install typings directly from the node_modules like that 👍

@vikvincer

This comment has been minimized.

Show comment
Hide comment
@vikvincer

vikvincer Apr 18, 2017

Hi anyone knows whats wrong.
ERROR in .//firebase/app/shared_promise.js
Module not found: Error: Can't resolve 'promise-polyfill' in 'C:\Users\IBM_ADMIN\ng2-tuts\king-tutor-app\node_modules\firebase\app'
@ ./
/firebase/app/shared_promise.js 22:35-62
@ .//firebase/app/firebase_app.js
@ ./
/firebase/app.js
@ .//firebase/firebase-browser.js
@ ./
/angularfire2/angularfire2.js
@ ./~/angularfire2/index.js
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts
webpack: Failed to compile.

vikvincer commented Apr 18, 2017

Hi anyone knows whats wrong.
ERROR in .//firebase/app/shared_promise.js
Module not found: Error: Can't resolve 'promise-polyfill' in 'C:\Users\IBM_ADMIN\ng2-tuts\king-tutor-app\node_modules\firebase\app'
@ ./
/firebase/app/shared_promise.js 22:35-62
@ .//firebase/app/firebase_app.js
@ ./
/firebase/app.js
@ .//firebase/firebase-browser.js
@ ./
/angularfire2/angularfire2.js
@ ./~/angularfire2/index.js
@ ./src/app/app.module.ts
@ ./src/main.ts
@ multi webpack-dev-server/client?http://localhost:4200/ ./src/main.ts
webpack: Failed to compile.

@crazyhalls

This comment has been minimized.

Show comment
Hide comment
@crazyhalls

crazyhalls Apr 19, 2017

@doggy8088 new angularfire have the src\declarations.d.ts, works the same.

crazyhalls commented Apr 19, 2017

@doggy8088 new angularfire have the src\declarations.d.ts, works the same.

@kehkashanF

This comment has been minimized.

Show comment
Hide comment
@kehkashanF

kehkashanF Jul 3, 2017

@vikvincer you need to install the missing promise-polyfill, which is not available by default in the newer releases. https://www.npmjs.com/package/promise-polyfill :)

kehkashanF commented Jul 3, 2017

@vikvincer you need to install the missing promise-polyfill, which is not available by default in the newer releases. https://www.npmjs.com/package/promise-polyfill :)

@kehkashanF

This comment has been minimized.

Show comment
Hide comment
@kehkashanF

kehkashanF Jul 3, 2017

If anyone is still wondering, just check the new documentation for npm firebase (https://www.npmjs.com/package/firebase), especially the way it is now imported:

import * as firebase from 'firebase';

Many old tutorials have not changed this paticular line and there is not much support available online for it too. Hope this helps a few.

kehkashanF commented Jul 3, 2017

If anyone is still wondering, just check the new documentation for npm firebase (https://www.npmjs.com/package/firebase), especially the way it is now imported:

import * as firebase from 'firebase';

Many old tutorials have not changed this paticular line and there is not much support available online for it too. Hope this helps a few.

@david95thinkcode

This comment has been minimized.

Show comment
Hide comment
@david95thinkcode

david95thinkcode Jul 7, 2017

Hi everyone,
I have the same issu and it's wasting my time. So please, did someone find the solution ?
I've tried everything but nothing, need help
To be sure you'll understand my problem, please look at the pictures :
is

I don't know if I'm right but I think the problem comes from here.
issu

PS : I'm working on an Ionic project

david95thinkcode commented Jul 7, 2017

Hi everyone,
I have the same issu and it's wasting my time. So please, did someone find the solution ?
I've tried everything but nothing, need help
To be sure you'll understand my problem, please look at the pictures :
is

I don't know if I'm right but I think the problem comes from here.
issu

PS : I'm working on an Ionic project

@kehkashanF

This comment has been minimized.

Show comment
Hide comment
@kehkashanF

kehkashanF Jul 7, 2017

@david95thinkcode Did you try 'firebase' instead of 'firebase/app'?

It seems the documentation was recently changed:

// This import loads the firebase namespace along with all its type information.
import * as firebase from 'firebase/app';
// These imports load individual services into the firebase namespace.
import 'firebase/auth';
import 'firebase/database';

I manged to solve the problem in my Ionic app using this import.

kehkashanF commented Jul 7, 2017

@david95thinkcode Did you try 'firebase' instead of 'firebase/app'?

It seems the documentation was recently changed:

// This import loads the firebase namespace along with all its type information.
import * as firebase from 'firebase/app';
// These imports load individual services into the firebase namespace.
import 'firebase/auth';
import 'firebase/database';

I manged to solve the problem in my Ionic app using this import.

@vikvincer

This comment has been minimized.

Show comment
Hide comment
@vikvincer

vikvincer Jul 7, 2017

vikvincer commented Jul 7, 2017

@david95thinkcode

This comment has been minimized.

Show comment
Hide comment
@david95thinkcode

david95thinkcode Jul 7, 2017

@kehkashanF I've tried that this too but it didn't work.
Yeah, I saw the changes in the docs and tried the new specifications but it still not working :(

david95thinkcode commented Jul 7, 2017

@kehkashanF I've tried that this too but it didn't work.
Yeah, I saw the changes in the docs and tried the new specifications but it still not working :(

@david95thinkcode

This comment has been minimized.

Show comment
Hide comment
@david95thinkcode

david95thinkcode Jul 9, 2017

Issue fixed. I've reinstall firebase and everything work perfectly 👌

david95thinkcode commented Jul 9, 2017

Issue fixed. I've reinstall firebase and everything work perfectly 👌

@Suka1215

This comment has been minimized.

Show comment
Hide comment
@Suka1215

Suka1215 Dec 19, 2017

Just run yarn remove firebase --save
then clean cache and run yarn add firebase --save
It is losing ref to the namespace of firebase not an angularfire2 issue.

Suka1215 commented Dec 19, 2017

Just run yarn remove firebase --save
then clean cache and run yarn add firebase --save
It is losing ref to the namespace of firebase not an angularfire2 issue.

@ghost

This comment has been minimized.

Show comment
Hide comment
@ghost

ghost Dec 20, 2017

ERROR in error TS6053: File '/node_modules/angularfire2/firebase3.d.ts' not found.

Ok the above error is a nightmare now.

/myPackageName/package.json

 "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-next",
    "firebase": "4.8.0", 
    "core-js": "^2.4.1",
    "rxjs": "^5.5.2",
    "uuid": "^3.1.0",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.6.1",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/language-service": "^5.0.0",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "~2.4.2"
  }
}

ghost commented Dec 20, 2017

ERROR in error TS6053: File '/node_modules/angularfire2/firebase3.d.ts' not found.

Ok the above error is a nightmare now.

/myPackageName/package.json

 "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-next",
    "firebase": "4.8.0", 
    "core-js": "^2.4.1",
    "rxjs": "^5.5.2",
    "uuid": "^3.1.0",
    "zone.js": "^0.8.14"
  },
  "devDependencies": {
    "@angular/cli": "1.6.1",
    "@angular/compiler-cli": "^5.0.0",
    "@angular/language-service": "^5.0.0",
    "@types/jasmine": "~2.5.53",
    "@types/jasminewd2": "~2.0.2",
    "@types/node": "~6.0.60",
    "codelyzer": "^4.0.1",
    "jasmine-core": "~2.6.2",
    "jasmine-spec-reporter": "~4.1.0",
    "karma": "~1.7.0",
    "karma-chrome-launcher": "~2.1.1",
    "karma-cli": "~1.0.1",
    "karma-coverage-istanbul-reporter": "^1.2.1",
    "karma-jasmine": "~1.1.0",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.1.2",
    "ts-node": "~3.2.0",
    "tslint": "~5.7.0",
    "typescript": "~2.4.2"
  }
}
@alx-andru

This comment has been minimized.

Show comment
Hide comment
@alx-andru

alx-andru Dec 20, 2017

If looking for auth-types, import @firebase/auth-types

import * as firebase from 'firebase';
import { User } from '@firebase/auth-types';

then you can use the firebase user just like this: public user: User;

alx-andru commented Dec 20, 2017

If looking for auth-types, import @firebase/auth-types

import * as firebase from 'firebase';
import { User } from '@firebase/auth-types';

then you can use the firebase user just like this: public user: User;

@paulimfavarato

This comment has been minimized.

Show comment
Hide comment
@paulimfavarato

paulimfavarato Dec 20, 2017

back to version "firebase": "4.8.0". remember to clear your cache. to check the version use npm list firebase

paulimfavarato commented Dec 20, 2017

back to version "firebase": "4.8.0". remember to clear your cache. to check the version use npm list firebase

@dunlavy

This comment has been minimized.

Show comment
Hide comment
@dunlavy

dunlavy Dec 20, 2017

This issue just wasted shit tons of our time. I'm sticking with the new Firebase but holy crap getting this working was needlessly shit.

@alx-andru Thanks for the good suggestion. Got me working, although sometimes I have to recompile. Yep, even with your suggestion, I still get this behavior in a very fresh project build with the Angular CLI:

ng serve
** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Date: 2017-12-20T10:00:51.758Z
Hash: 11914b299a7274a699d9
Time: 3134ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 2.93 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 636 bytes [initial] [rendered]
chunk {scripts} scripts.bundle.js (scripts) 72.7 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 918 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 853 kB [initial] [rendered]

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'.
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/database/database.d.ts(7,15): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/interfaces.d.ts(3,50): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(3,80): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(12,20): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(42,40): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(43,41): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(44,37): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/list/audit-trail.d.ts(7,133): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(6,135): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(7,113): error TS2503: Cannot find namespace 'database'.
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'.


webpack: Failed to compile.
webpack: Compiling...
 90% chunk assets processingERROR 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'.
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/database/database.d.ts(7,15): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/interfaces.d.ts(3,50): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(3,80): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(12,20): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(42,40): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(43,41): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(44,37): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/list/audit-trail.d.ts(7,133): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(6,135): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(7,113): error TS2503: Cannot find namespace 'database'.
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'.
                                                                                                                                                                                                                                                                                     Date: 2017-12-20T10:00:59.912Z
Hash: e4bd8e4f1e7cf9d121a8
Time: 4196ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry]
chunk {main} main.bundle.js (main) 67 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 546 kB [initial] [rendered]
chunk {scripts} scripts.bundle.js (scripts) 72.7 kB [initial]
chunk {styles} styles.bundle.js (styles) 918 kB [initial]
chunk {vendor} vendor.bundle.js (vendor) 11.3 MB [initial] [rendered]

webpack: Compiled successfully.

Here's what I do to get my project working:

Run ng serve.
It fails.
Then I open a file.
Save small changes.
ng serve reattempts compilation.
It works. See above.

dunlavy commented Dec 20, 2017

This issue just wasted shit tons of our time. I'm sticking with the new Firebase but holy crap getting this working was needlessly shit.

@alx-andru Thanks for the good suggestion. Got me working, although sometimes I have to recompile. Yep, even with your suggestion, I still get this behavior in a very fresh project build with the Angular CLI:

ng serve
** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Date: 2017-12-20T10:00:51.758Z
Hash: 11914b299a7274a699d9
Time: 3134ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 2.93 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 636 bytes [initial] [rendered]
chunk {scripts} scripts.bundle.js (scripts) 72.7 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 918 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 853 kB [initial] [rendered]

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'.
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/database/database.d.ts(7,15): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/interfaces.d.ts(3,50): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(3,80): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(12,20): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(42,40): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(43,41): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(44,37): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/list/audit-trail.d.ts(7,133): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(6,135): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(7,113): error TS2503: Cannot find namespace 'database'.
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'.


webpack: Failed to compile.
webpack: Compiling...
 90% chunk assets processingERROR 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'.
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/database/database.d.ts(7,15): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/interfaces.d.ts(3,50): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(3,80): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(12,20): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(42,40): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(43,41): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/interfaces.d.ts(44,37): error TS2503: Cannot find namespace 'firebase'.
node_modules/angularfire2/database/list/audit-trail.d.ts(7,133): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(6,135): error TS2503: Cannot find namespace 'database'.
node_modules/angularfire2/database/list/state-changes.d.ts(7,113): error TS2503: Cannot find namespace 'database'.
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'.
                                                                                                                                                                                                                                                                                     Date: 2017-12-20T10:00:59.912Z
Hash: e4bd8e4f1e7cf9d121a8
Time: 4196ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry]
chunk {main} main.bundle.js (main) 67 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 546 kB [initial] [rendered]
chunk {scripts} scripts.bundle.js (scripts) 72.7 kB [initial]
chunk {styles} styles.bundle.js (styles) 918 kB [initial]
chunk {vendor} vendor.bundle.js (vendor) 11.3 MB [initial] [rendered]

webpack: Compiled successfully.

Here's what I do to get my project working:

Run ng serve.
It fails.
Then I open a file.
Save small changes.
ng serve reattempts compilation.
It works. See above.

@byblix

This comment has been minimized.

Show comment
Hide comment
@byblix

byblix Dec 20, 2017

I have the exact same output as @dunlavy.
Im pissed off, and willing to do anything by now... Tried everything in this thread.

EDIT: Apparently it works being pissed off - here's how i managed it (not sure if everything is necessary though):

  1. npm uninstall firebase
  2. npm install firebase
  3. import in main.ts: import * as firebase from 'firebase';
  4. rename imports in the firebase.service.ts to: import * as firebase from 'firebase';

byblix commented Dec 20, 2017

I have the exact same output as @dunlavy.
Im pissed off, and willing to do anything by now... Tried everything in this thread.

EDIT: Apparently it works being pissed off - here's how i managed it (not sure if everything is necessary though):

  1. npm uninstall firebase
  2. npm install firebase
  3. import in main.ts: import * as firebase from 'firebase';
  4. rename imports in the firebase.service.ts to: import * as firebase from 'firebase';
@vzts

This comment has been minimized.

Show comment
Hide comment
@vzts

vzts Dec 20, 2017

Have a look at #firebase/firebase-js-sdk#387 & #firebase/firebase-js-sdk#388.

Now you need to use the new type reference as @myspivey mentioned in the 2nd issue. They had a refactoring on typings in 4.8.1.

But if you are just bothered to change any of your code, fixing your firebase dependency version to 4.8.0 will solve these errors for you.

vzts commented Dec 20, 2017

Have a look at #firebase/firebase-js-sdk#387 & #firebase/firebase-js-sdk#388.

Now you need to use the new type reference as @myspivey mentioned in the 2nd issue. They had a refactoring on typings in 4.8.1.

But if you are just bothered to change any of your code, fixing your firebase dependency version to 4.8.0 will solve these errors for you.

@ghost

This comment has been minimized.

Show comment
Hide comment
@ghost

ghost Dec 20, 2017

Thank you @paulimfavarato & @vzts that worked, using 4.8.0 works for me, with the above configuration from my last post. 💯
It will save a lot of headaches if you use "firebase": "4.8.0".

ghost commented Dec 20, 2017

Thank you @paulimfavarato & @vzts that worked, using 4.8.0 works for me, with the above configuration from my last post. 💯
It will save a lot of headaches if you use "firebase": "4.8.0".

@Metsuryu

This comment has been minimized.

Show comment
Hide comment
@Metsuryu

Metsuryu Dec 21, 2017

I also just had this issue.

Upgrading firebase to version 4.8.0 fixed it, but 4.8.1 breaks it again, so if anyone is having problems, make sure you use 4.8.0, not 4.8.1

Metsuryu commented Dec 21, 2017

I also just had this issue.

Upgrading firebase to version 4.8.0 fixed it, but 4.8.1 breaks it again, so if anyone is having problems, make sure you use 4.8.0, not 4.8.1

@VictorAnquino

This comment has been minimized.

Show comment
Hide comment
@VictorAnquino

VictorAnquino Dec 21, 2017

you only need to uninstall firebase and reinstall

npm uninstall firebase

npm install --save firebase@4.8.0

delete node modules and reinstall it

rm -rf node_module && npm i

VictorAnquino commented Dec 21, 2017

you only need to uninstall firebase and reinstall

npm uninstall firebase

npm install --save firebase@4.8.0

delete node modules and reinstall it

rm -rf node_module && npm i

@vzts

This comment has been minimized.

Show comment
Hide comment

vzts commented Dec 23, 2017

@dunlavy

This comment has been minimized.

Show comment
Hide comment
@dunlavy

dunlavy Jan 3, 2018

Thank you all for your excellent contributions, BTW!

dunlavy commented Jan 3, 2018

Thank you all for your excellent contributions, BTW!

@androidovshchik

This comment has been minimized.

Show comment
Hide comment
@androidovshchik

androidovshchik Jan 7, 2018

For me forced installing npm install firebase@x.x.x helped
Which also suggested @VictorAnquino

androidovshchik commented Jan 7, 2018

For me forced installing npm install firebase@x.x.x helped
Which also suggested @VictorAnquino

@MrDrProfX

This comment has been minimized.

Show comment
Hide comment
@MrDrProfX

MrDrProfX Jan 8, 2018

VictorAnquino's solution worked for me. It sucks that we're tied to a specific version of firebase though... We really need a better solution.

MrDrProfX commented Jan 8, 2018

VictorAnquino's solution worked for me. It sucks that we're tied to a specific version of firebase though... We really need a better solution.

@ashrafalngar4

This comment has been minimized.

Show comment
Hide comment
@ashrafalngar4

ashrafalngar4 Jan 9, 2018

  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.

ashrafalngar4 commented Jan 9, 2018

  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.
@irman

This comment has been minimized.

Show comment
Hide comment
@irman

irman Jan 13, 2018

There's version 4.8.2. I've updated it and it seems to be fixed now.

irman commented Jan 13, 2018

There's version 4.8.2. I've updated it and it seems to be fixed now.

@dunlavy

This comment has been minimized.

Show comment
Hide comment
@dunlavy

dunlavy commented Jan 26, 2018

@irman Confirmed.

@chezdrz

This comment has been minimized.

Show comment
Hide comment
@chezdrz

chezdrz Jan 28, 2018

@dunlavy @irman
Did you do any other fix other than the ones suggested ?
this error suddenly started cropping up for me and not able to resolve it.

I tried the following

npm uninstall firebase
npm cache clear --force
npm install firebae@4.8.0

Even tried
npm install firebase --latest

Nothing works
I tried 4.8.2 , even that does not work.

chezdrz commented Jan 28, 2018

@dunlavy @irman
Did you do any other fix other than the ones suggested ?
this error suddenly started cropping up for me and not able to resolve it.

I tried the following

npm uninstall firebase
npm cache clear --force
npm install firebae@4.8.0

Even tried
npm install firebase --latest

Nothing works
I tried 4.8.2 , even that does not work.

@Sampath-Lokuge

This comment has been minimized.

Show comment
Hide comment
@Sampath-Lokuge

Sampath-Lokuge Jan 29, 2018

This worked for me 👍

  "angularfire2": "5.0.0-rc.6",
 "firebase": "4.8.2",

Note: Don't forget to delete node_modules folder and npm i.

Sampath-Lokuge commented Jan 29, 2018

This worked for me 👍

  "angularfire2": "5.0.0-rc.6",
 "firebase": "4.8.2",

Note: Don't forget to delete node_modules folder and npm i.

@dunlavy

This comment has been minimized.

Show comment
Hide comment
@dunlavy

dunlavy Feb 8, 2018

@chezdrz Sorry for the late response. I took a vacation. ;-)

I used the troublesome work-around I posted above. May or may not work for you I suppose, but I was able to develop this way for awhile before I simply updated my project dependencies to 4.8.2. That cleared everything up for me perfectly. Be sure to update AngularFire and perhaps even Angular if you're not using the very latest release (and that doesn't break your project).

dunlavy commented Feb 8, 2018

@chezdrz Sorry for the late response. I took a vacation. ;-)

I used the troublesome work-around I posted above. May or may not work for you I suppose, but I was able to develop this way for awhile before I simply updated my project dependencies to 4.8.2. That cleared everything up for me perfectly. Be sure to update AngularFire and perhaps even Angular if you're not using the very latest release (and that doesn't break your project).

@JuniaYulia

This comment has been minimized.

Show comment
Hide comment
@JuniaYulia

JuniaYulia May 5, 2018

import * as firebase from 'firebase ;
should fix the problem

JuniaYulia commented May 5, 2018

import * as firebase from 'firebase ;
should fix the problem

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment