Integration with AngularFire2

This page shows how to integrate angularfire2 ([email protected] & [email protected]) into the seed.

1. Install angularfire2 and firebase:

npm install --save angularfire2 firebase

2. Install typings for firebase (angular2fire currently relies on the firebase3.d.ts file for typings):

typings install file:node_modules/angularfire2/firebase3.d.ts --save --global

3. In tools/config/project.config.ts, inside the ProjectConfig constructor:

constructor() {

    this.SYSTEM_CONFIG_DEV.paths['firebase'] =
      `${this.APP_BASE}node_modules/firebase/firebase`;

    this.SYSTEM_CONFIG_DEV.paths['angularfire2'] =
      `${this.APP_BASE}node_modules/angularfire2/angularfire2`;

    this.SYSTEM_BUILDER_CONFIG.packages['firebase'] = {
        main: 'firebase.js',
        defaultExtension : 'js'
    };

    this.SYSTEM_BUILDER_CONFIG.packages['angularfire2'] = {
        main: 'angularfire2.js',
        defaultExtension : 'js'
    };

4. Use angularfire2!

import { FIREBASE_PROVIDERS, defaultFirebase } from 'angularfire2';

/* other imports/code */

bootstrap(AppComponent, [
  FIREBASE_PROVIDERS,
  defaultFirebase({
    apiKey: '<->',
    authDomain: '<->',
    databaseURL: '<->',
    storageBucket: '<->',
  })
]);