angularfirebaseangularfireangular4-forms

Metadata version mismatch for module /node_modules/angularfire2/index.d.ts, found version 4, expected 3, resolving symbol AppModule


I integer angulafire2 and firebase in my application angular4 but I have this error when I launch server :

enter image description here

I just add code that I find in documentation ... I use firebase version 4.8.0 and for angularfire2 I install from documentation with npm install

code app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
  import { NgModule } from '@angular/core';
  import { RouterModule, Routes } from '@angular/router';
  import { AngularFireModule } from 'angularfire2';
  import { AngularFireDatabase } from 'angularfire2/database';
  import { AngularFireAuth } from 'angularfire2/auth';
  import { EmployeeService } from './services/employee.service';


  import { AppComponent } from './app.component';
  import { DashboardComponent } from './components/dashboard/dashboard.component';
  import { EmployeeInfoComponent } from './components/employee-info/employee-info.component';
  import { AddEmployeeComponent } from './components/add-employee/add-employee.component';
  import { EditEmployeeComponent } from './components/edit-employee/edit-employee.component';
  import { NavbarComponent } from './components/navbar/navbar.component';
  import { SidebarComponent } from './components/sidebar/sidebar.component';
  import { LoginComponent } from './components/login/login.component';
  import { RegisterComponent } from './components/register/register.component';
  import { SettingsComponent } from './components/settings/settings.component';
  import { PageNotFoundComponent } from './components/page-not-found/page-not-found.component';

  export const FirebaseAppConfig = {
      apiKey: "<api_key>",
      authDomain: "domaine",
      databaseURL: "url database",
      projectId: "id",
      storageBucket: "storage",
      messagingSenderId: "senderid"  
  };


  const appRoutes: Routes=[
    {path:'',component:DashboardComponent},
    {path:'register',component:RegisterComponent},
    {path:'login',component:LoginComponent}
  ]

  @NgModule({
    declarations: [
      AppComponent,
      DashboardComponent,
      EmployeeInfoComponent,
      AddEmployeeComponent,
      EditEmployeeComponent,
      NavbarComponent,
      SidebarComponent,
      LoginComponent,
      RegisterComponent,
      SettingsComponent,
      PageNotFoundComponent
    ],
    imports: [
      BrowserModule,
      AngularFireModule.initializeApp(FirebaseAppConfig),
      RouterModule.forRoot(appRoutes)
    ],
    providers: [
      AngularFireDatabase,
      AngularFireAuth ,
      EmployeeService
    ],
    bootstrap: [AppComponent]
  })
  export class AppModule { }

Solution

  • its hack, think well before do it:

    change version 4 to 3, in file node_modules/angularfire2/...metadata.json