Firebase-js-sdk: cloud firestore setup issue with ionic 3.7.1

[faraazc]

[REQUIRED] Describe your environment

• Operating System version: __osx_10.12.2__
• Firebase SDK version: __4.5.0___
• Firebase Product: __cloud firestore___ (auth, database, storage, etc)

[REQUIRED] Describe the problem

Tried using ionic 3.x latest (3.7.1)
Updated firebase js sdk to 4.5.0.

Seeing below errors

ERROR Error: Uncaught (in promise): TypeError: __WEBPACK_IMPORTED_MODULE_2_firebase___default.a.firestore is not a function
TypeError: __WEBPACK_IMPORTED_MODULE_2_firebase___default.a.firestore is not a function

Steps to reproduce:

Relevant Code:

http://jsbin.com/rinilu/edit?js,console

// TODO(you): code here to reproduce the problem
import firebase from 'firebase';

var db = firebase.firestore();

[jshcrowthe]

Hey @faraazc thanks for your interest in using Cloud Firestore! By default firebase.firestore is not included in the main bundle. You need to manually include the SDK in your package.

You should be able to modify the code you sent as follows and it should work:

import firebase from 'firebase';
import 'firebase/firestore';

var db = firebase.firestore();

Let me know if that works for you.

[dominikstrasser]

Hey.
i also had to
npm install @firebase/webchannel-wrapper --save-exact
don't know if this is only the case for my setup...

[jshcrowthe]

I think it is probably an issue w/ your setup. I just tried a clean install and the @firebase/webchannel-wrapper package is installed w/o issue.

[faraazc]

@jshcrowthe Thanks. Now it works after applying your suggestion.

should not firebase.firestore be part of main bundle?. it will be good so that we use like other firebase products like database,storage.

If there is any limitation in bundling with main, you may proceed to close this issue. for now it works for me with your suggestion

[jshcrowthe]

Glad to hear it works for you @faraazc. We opted to omit the firestore SDK from the main bundle so that users don't have to incur the weight of Firestore in addition to database if they aren't using it.

Eventually we would like to push people more towards only using the pieces of the SDK that they actually need and to import them directly

_i.e._

// Import the app directly 
import firebase from 'firebase/app';
import 'firebase/firestore';

firebase.firestore()...

@dominikstrasser if you can isolate and reproduce your issue please feel free to raise a new issue.

[kwes01]

how you initialize the firebaseapp ??

[noor07]

Firebase.initializeApp() is not working i imported too. What should I do?