Nicolas Desclaux
Nicolas Desclaux

Reputation: 33

Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app)

first I'm sorry, this is the first time I ask a question on a forum and I don't speak english very well... I'm working on an application with Ionic 3 and I'm getting this error when I try to use firebase :

Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app)

Here are my files :

App.module.ts :

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';

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

import { MyApp } from './app.component';
import { HomePage } from '../pages/home/home';
import {TabsPage} from "../pages/tabs/tabs";
import {ListPage} from "../pages/list/list";
import {AuthPage} from "../pages/auth/auth";
import {AuthService} from "../Services/Authentification/auth.service";
import {FIREBASE_CONFIG} from "./app.firebase.config";

    @NgModule({
      declarations: [
        MyApp,
        HomePage,
        TabsPage,
        ListPage,
        AuthPage,
      ],
      imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp),
        AngularFireModule.initializeApp(FIREBASE_CONFIG),
        AngularFireAuthModule,
      ],
      bootstrap: [IonicApp],
      entryComponents: [
        MyApp,
        HomePage,
        TabsPage,
        ListPage,
        AuthPage,
      ],
      providers: [
        StatusBar,
        SplashScreen,
        {provide: ErrorHandler, useClass: IonicErrorHandler},
        AuthService,
      ]
    })
    export class AppModule {}

app.firebase.config :

export const FIREBASE_CONFIG = {

  apiKey: "...",
  authDomain: "...",
  databaseURL: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "..."

};

I've search solutions on others forum but nothing worked. If you need more information tell me

Upvotes: 1

Views: 8737

Answers (1)

William Terrill
William Terrill

Reputation: 3744

I'm guessing that you might have a problem with the path of the file to your Firebase_config definition. I moved away from angularFire a while back, but I remember that the initialization was similar. Here's my app.module.ts file below... so, perhaps this is something you can try:

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { RouterModule, RouteReuseStrategy, Routes } from '@angular/router'; 
import { IonicModule, IonicRouteStrategy } from '@ionic/angular'; 
import { SplashScreen } from '@ionic-native/splash-screen/ngx'; 
import { StatusBar } from '@ionic-native/status-bar/ngx'; 
import { AppComponent } from './app.component'; 
import { AppRoutingModule } from './app-routing.module';
import * as firebase from 'firebase';
    
      // Initialize Firebase
      export const config = {
        apiKey: "CENSORED",
        authDomain: "CENSORED.firebaseapp.com",
        databaseURL: "https://CENSORED.firebaseio.com",
        projectId: "CENSORED-fffff",
        storageBucket: "sCENSORED-fffff.appspot.com",
        messagingSenderId: "CENSORED"   
      };
      firebase.initializeApp(config);     <--------initialize here
    


@NgModule({
  declarations: [
    AppComponent, 
    LoginFormComponent, 
   ],
  entryComponents: [
  ],
  imports: [
    BrowserModule, 
    IonicModule.forRoot(),    <----No mention of firebase down here
    AppRoutingModule,
    IonicStorageModule.forRoot(),
  ],
  providers: [
    AuthenticationService,
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy }
  ],
  bootstrap: [AppComponent]
})
export class AppModule {}

Upvotes: 6

Related Questions