title: NullInjectorError: No provider for AngularFirestore
body: <p>I'm learning Angular looking for help in fixing the error:
  I'm following this link : <a href="https://github.com/angular/angularfire2/blob/master/docs/install-and-setup.md" rel="noreferrer">https://github.com/angular/angularfire2/blob/master/docs/install-and-setup.md</a>
  to create a angular small app with angular2 and angularfirestore2</p>
  
  <p>but when I hit ng serve I am getting the below error in browser console..</p>
  
  <pre><code>StaticInjectorError[AngularFirestore]: 
    StaticInjectorError[AngularFirestore]: 
      NullInjectorError: No provider for AngularFirestore!
      at _NullInjector.get (core.js:923)
      at resolveToken (core.js:1211)
      at tryResolveToken (core.js:1153)
      at StaticInjector.get (core.js:1024)
      at resolveToken (core.js:1211)
      at tryResolveToken (core.js:1153)
      at StaticInjector.get (core.js:1024)
      at resolveNgModuleDep (core.js:10585)
      at NgModuleRef_.get (core.js:11806)
      at resolveDep (core.js:12302)
  </code></pre>
  
  <p>I tried googling it but didn't find the exact solution nothing worked for me :(,</p>
  
  <p>Here is what I followed:
  1) Installed Node Version 8.9.1
  2) npm install -g @angular/cli --> Version 1.5.2
  3) ng new 'project-name'
  4) npm install angularfire2 firebase --save</p>
  
  <p>Here are my app.module.ts file:</p>
  
  <pre class="lang-ts prettyprint-override"><code>import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { AppComponent } from './app.component';
  import { AngularFireModule } from 'angularfire2';
  import { environment } from '../environments/environment';
  
  @NgModule({
    imports: [
      BrowserModule,
      AngularFireModule.initializeApp(environment.firebase)
    ],
    declarations: [ AppComponent ],
    bootstrap: [ AppComponent ]
  })
  export class AppModule {}
  </code></pre>
  
  <p>app.component.ts:</p>
  
  <pre class="lang-ts prettyprint-override"><code>import { Component } from '@angular/core';
  import { AngularFirestore } from 'angularfire2/firestore';
  import { Observable } from 'rxjs/Observable';
  
  @Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
  })
  export class AppComponent {
    title = 'app';
    constructor(db: AngularFirestore) {}
  }
  </code></pre>
  
  <p>environemnt.ts:</p>
  
  <pre class="lang-ts prettyprint-override"><code>export const environment = {
    production: false,
    firebase: {
      apiKey: 'xxxxx',
      authDomain: 'aaaaaaa',
      databaseURL: 'bbbbbbbbbbbbbbbbbb',
      projectId: 'aaaaaaaaaaaaaa',
      storageBucket: 'aaaaaaaaaaaa',
      messagingSenderId: 'aaaaaaaaaaaaa'
    }
  };
  </code></pre>
  
  <p>then ng serve, and I am getting the above error...</p>