Firebase,Angular 4 Root Module&功能模块 - "没有Firebase应用程序' [默认]'已创建 - 请致电Firebase App.initializeApp()。"

时间:2017-06-30 19:00:14

标签: angular typescript firebase firebase-storage angularfire2

在我的应用程序中,我有一个根模块(app.module.ts)和一个功能模块(contact.module.ts)。我在根模块中使用AngularFireModule作为设置(下面),由于某种原因,我收到此错误:" error_handler.js:47原始异常:没有Firebase应用程序' [DEFAULT] '已创建 - 请致电Firebase App.initializeApp()。"我想知道为什么。

app.module.ts

import { NgModule } from '@angular/core';
import { HttpModule } from '@angular/http';
import { BrowserModule } from '@angular/platform-browser';
import { ReactiveFormsModule } from '@angular/forms';

import * as firebase from 'firebase';
import { AngularFireModule } from 'angularfire2';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { AngularFireAuthModule, AngularFireAuth } from 'angularfire2/auth';
import { environment} from '../environments/environment';

import { AppComponent } from './app.component';
import { ContactModule} from "./customer/customer.module";
import { AuthenticationService } from "./authentication/authentication.service";

@NgModule({
   declarations: [
   AppComponent
 ],
 imports: [
   BrowserModule,
   ReactiveFormsModule,
   HttpModule,
   AngularFireModule.initializeApp(environment.firebase),
   AngularFireDatabaseModule,
   AngularFireAuthModule,
   ContactModule
 ],
 providers: [AuthenticationService],
 bootstrap: [AppComponent]
})
export class AppModule { }

environment.ts

export const environment = {
 production: false,
 firebase = {
   apiKey: "",
   authDomain: "",
   databaseURL: "",
   projectId: "",
   storageBucket: "",
   messagingSenderId: ""
 }
}

contact.ts(v1)

import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import * as firebase from 'firebase';

@Component({
  //...
})
export class ContactComponent implements OnInit {
  //...
  constructor(private _router: Router) {
    // Get a reference to the storage service
    const storageSvc = firebase.storage();

    // Create a storage reference from our storage service
    const storageRef = storageSvc.ref();

    const picStorageRef = storageRef.child('contacts/pic1.jpg');

    picStorageRef.getDownloadURL().then(url => this.picURL = url);
  }

  ngOnInit() {}
}

再次,出于某种原因,我收到此错误:" error_handler.js:47原始异常:没有Firebase应用程序' [默认]'已创建 - 请致电Firebase App.initializeApp()。"

我尝试将firebase配置对象从 environment.ts 文件移动到app.module.ts文件,但它没有解决错误。它仅在我在contact.ts文件中导入firebase时才有效:

contact.ts(v2)

//...
import * as firebase from 'firebase';
import { environment } from '../../environments/environment';

//...
export class ContactComponent implements OnInit {
 //...
 constructor(//...) {
   firebase.initializeApp(environment.firebase);
   // Get a reference to the storage service
    const storageSvc = firebase.storage();

    // Create a storage reference from our storage service
    const storageRef = storageSvc.ref();

    const picStorageRef = storageRef.child('contacts/pic1.jpg');

    picStorageRef.getDownloadURL().then(url => this.picURL = url);
 }
}

这可能与功能模块 contact.module.ts 的实施有关。就这样你知道,我也尝试将firebase配置移动到 contact.module.ts ,但错误仍然存​​在。所以我想知道如何设置一个firebase配置应用程序,以使其运行,而不必从contact.ts文件初始化firebase。

任何帮助将不胜感激。 感谢

0 个答案:

没有答案