I’m trying to use Firebase with Ionic. My instructor has provided a file that we can use as a provider, which is:
import { Injectable } from '@angular/core';
import 'rxjs/add/operator/map';
declare var firebase: any;
@Injectable()
export class FirebaseProvider {
constructor() {
let config = {
apiKey: "",
authDomain: "",
databaseURL: "",
storageBucket: "",
messagingSenderId: ""
};
firebase.initializeApp(config);
}
db() {
return firebase;
}
}
The fields from config
are populated with our Firebase credentials.
I imported both in app.ts
and login.ts
(where I’m trying to use the API), but I get this on console when I serve the app:
EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in ./LoginPage class LoginPage_Host - inline template:0:0
ORIGINAL EXCEPTION: ReferenceError: firebase is not defined
ORIGINAL STACKTRACE:
ReferenceError: firebase is not defined
at new FirebaseProvider (http://localhost:8100/build/js/app.bundle.js:197:9)
at http://localhost:8100/build/js/app.bundle.js:35959:45
at ReflectiveInjector_.instantiate (http://localhost:8100/build/js/app.bundle.js:29494:27)
at ReflectiveInjector.instantiateProvider (http://localhost:8100/build/js/app.bundle.js:29435:25)
at ReflectiveInjector.new (http://localhost:8100/build/js/app.bundle.js:29424:21)
at ReflectiveInjectorDynamicStrategy.getObjByKeyId (http://localhost:8100/build/js/app.bundle.js:29076:50)
at ReflectiveInjector.getByKeyDefault (http://localhost:8100/build/js/app.bundle.js:29604:38)
at ReflectiveInjector.getByKey (http://localhost:8100/build/js/app.bundle.js:29576:25)
at ReflectiveInjector.get (http://localhost:8100/build/js/app.bundle.js:29385:21)
at ElementInjector.get (http://localhost:8100/build/js/app.bundle.js:31156:48)
ERROR CONTEXT:
[object Object]
A not so quick Google search showed people with similar issues with a Google Maps thing, but I had no luck.
My system information:
Cordova CLI: 6.3.1
Ionic CLI Version: 2.0.0
Ionic App Lib Version: 2.0.0
OS: Distributor ID: Ubuntu Description: Ubuntu 16.04.1 LTS
Node Version: v4.2.6