title: Ionic2+Firebase app compile error: TypeScript error:Error TS2503: Cannot find namespace 'firebase'
body: <p>I am new to Ionic2 and using firebase for the first time. While trying a sample login app using the above two I got a compile error as </p>
  
  <p>TypeScript error: </p>
  
  <blockquote>
    <p>TypeScript error:
    /ionic/devdactic-firebase22/node_modules/angularfire2/database/database.d.ts(9,29):
    Error TS2503: Cannot find namespace 'firebase'. TypeScript error:
    /ionic/devdactic-firebase22/node_modules/angularfire2/database/database.d.ts(10,31):
    Error TS2503: Cannot find namespace 'firebase'. TypeScript error:
    /ionic/devdactic-firebase22/node_modules/angularfire2/providers/auth.d.ts(15,40):
    Error TS2503: Cannot find namespace 'firebase'. TypeScript error:
    /ionic/devdactic-firebase22/node_modules/angularfire2/providers/auth.d.ts(16,52):
    Error TS2503: Cannot find namespace 'firebase'. TypeScript
    error:/ionic/devdactic-firebase22/node_modules/angularfire2/providers/auth.d.ts(16,92):
    Error TS2503: Cannot find namespace 'firebase'.</p>
  </blockquote>
  
  <p>I have tried with install guide for AngularFire : <a href="https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md" rel="nofollow">https://github.com/angular/angularfire2/blob/master/docs/1-install-and-setup.md</a>  .</p>
  
  <p>Also tried to import firebase in my app.ts as</p>
  
  <blockquote>
    <p>import * as firebase from 'firebase';</p>
  </blockquote>
  
  <p>still couldn't find any solution. What could be the reason and how can I solve it?</p>
  
  <p>I am using  angularfire2@^2.0.0-beta.2
  and firebase@^2.4.2.</p>
  
  <p>app.ts</p>
  
  <pre><code>import {Component} from '@angular/core';
  import {Platform, ionicBootstrap} from 'ionic-angular';
  import {StatusBar} from 'ionic-native';
  import {LoginPage} from './pages/login/login';
  import * as firebase from 'firebase';
  
  import {FIREBASE_PROVIDERS,
    defaultFirebase,
    AngularFire,
    AuthMethods,
    AuthProviders,
    firebaseAuthConfig} from 'angularfire2';
  
  
  @Component({
    template: '&lt;ion-nav [root]="rootPage"&gt;&lt;/ion-nav&gt;',
    providers: [
          FIREBASE_PROVIDERS,
          // defaultFirebase('https://loginapp-a08a6.firebaseio.com/'),
          firebaseAuthConfig({
             provider: AuthProviders.Password,
             method: AuthMethods.Password
         })
      ]
  })
  export class MyApp {
    rootPage: any = LoginPage;
  
    constructor(platform: Platform) {
      platform.ready().then(() =&gt; {
        StatusBar.styleDefault();
      });
       var config = { 
         apiKey: "AIzaSyBU2Vqq7AjN4rlMWjyKBbXo2RVJXAR4TeM",
          authDomain: "loginapp-a08a6.firebaseapp.com",
          databaseURL: "https://loginapp-a08a6.firebaseio.com",
          storageBucket: "loginapp-a08a6.appspot.com",
        };
        firebase.initializeApp(config); 
    }
  }
  
  ionicBootstrap(MyApp);
  </code></pre>
  
  <p>login.ts:</p>
  
  <pre><code>import {Component} from '@angular/core';
  import {NavController, AlertController, LoadingController} from 'ionic-angular';
  import {FirebaseAuth} from 'angularfire2';
  import {HomePage} from '../home/home';
  
  @Component({
    templateUrl: 'build/pages/login/login.html',
  })
  export class LoginPage {
    // public loading: Loading;
  
    constructor(public nav: NavController,
     public auth: FirebaseAuth,
     private alertCtrl:AlertController,
     private loadingCtrl:LoadingController) {}
  
    public registerUser(credentials) {
      this.showLoading()
      this.auth.createUser(credentials).then((authData) =&gt; {
        let prompt = this.alertCtrl.create({
          title: 'Success',
          subTitle: 'Your new Account was created!',
          buttons: ['OK']
        });
        prompt.present();
      }).catch((error) =&gt; {
        this.showError(error);
      });
    }
  
    public login(credentials) {
      this.showLoading()
  
      this.auth.login(credentials).then((authData) =&gt; {
        this.nav.setRoot(HomePage);
      }).catch((error) =&gt; {
        this.showError(error);
      });
    }
  
    showLoading() {
      var loader = this.loadingCtrl.create({
        content: 'Please wait...',
        duration:3000
      });
     loader.present();
    }
  
    showError(text) {   
      let alert = this.alertCtrl.create({
        title: 'Fail',
        subTitle: text,
        buttons: ['OK']
      });
      alert.present();
    }
  }
  </code></pre>