Ajeesh Aju
Ajeesh Aju

Reputation: 1

Cant import Firebase in Ionic 2

I am using ionic 2. I am unable to use firebase import in ionic 2.

error

 Unused import: 'firebase'
 import { HomePage } from '../pages/home/home';
 import firebase from 'firebase';

Upvotes: 0

Views: 1532

Answers (3)

Chinedu Etoh
Chinedu Etoh

Reputation: 153

Run npm as an administrator and install with

npm install --save ng2-firebase

Upvotes: 0

Temeteron
Temeteron

Reputation: 161

After the installation process with npm install, you should probably import some other libraries from firebase that will be needed.

app.module.ts

import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireAuthModule } from 'angularfire2/auth';

export const firebaseConfig = {
  apiKey: "...",
  authDomain: "...",
  databaseURL: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "..."
};

@NgModule({
  ......
  ,
  imports: [
    BrowserModule,
    IonicModule.forRoot(MyApp),
    AngularFireModule.initializeApp(firebaseConfig),
    AngularFireDatabaseModule, // imports firebase/database, only needed for database features
    AngularFireAuthModule, // imports firebase/auth, only needed for auth features
  ],
.....
})

The firebaseConfig contains the info from your firebase setup at: https://console.firebase.google.com/u/0/ in one of your projects.

component.ts

import {AngularFireDatabase, FirebaseListObservable} from 'angularfire2/database';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
    users: FirebaseListObservable<any[]>;

    constructor(public navCtrl: NavController, public alertCtrl: AlertController, db: AngularFireDatabase, public actionSheetCtrl: ActionSheetController) {
        this.users = db.list('/users');
    }

......

}

In your component you will need the FirebaseListObservable to get your data from firebase. You need "observable", so that the list is always updated (o.g. Live score etc). And the AngularFireDatabase is needed to access firebase.

You can check this starter-kit: https://github.com/Temeteron/ionic2-firebase-starter-kit for more information.

Best of luck!

Upvotes: 0

marfyl
marfyl

Reputation: 161

You should install npm package before and import the firebase module in your app.module.ts

Installation:

npm install --save ng2-firebase

app.module.ts

import { AngularFireModule } from 'angularfire2';

app.module.ts imports

AngularFireModule.initializeApp(firebaseConfig)

Upvotes: 1

Related Questions