инициализировать firebase в angular 6 без angularfire

Question

Мне нужен проект, который инициализирует базу данных огня, используя AngularFire . Однако на протяжении всей разработки я не использовал много функций из AngularFire. Я всегда импортирую firebase/app в каждую службу и использую соответствующую функцию, например firebase.auth() или firebase.database().

С этим опытом я бы хотел инициализировать базу данных без AngularFire, поскольку я не использую методы AngularFire.

Теперь придем с моей проблемой: я не могу найти источник, который научил бы меня инициализировать базу данных, и, конечно, я вижу ошибку при импорте базы в app.module.ts.

Ниже мой код:

Установите базу огня, используя: npm i firebase

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';

import * as firebase from 'firebase';
import { environment } from '../environments/environment'; //API key is imported



@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    firebase.initializeApp(environment.firebase) //here shows the error
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

В строке firebase.initializeApp(environment.firebase) отображается ошибка:

Type 'App' is not assignable to type 'any[] | Type<any> | 
ModuleWithProviders<any>'.
Type 'App' is not assignable to type 'ModuleWithProviders<any>'.
Property 'ngModule' is missing in type 'App'.

Заранее спасибо.

Answer 1

Ну, вы не можете импортировать объект, который не является модулем Angular, и вы получаете эту ошибку из-за этого.

Вы можете:
1. Используйте его в конструкторе AppModule, например:

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule {
  constructor(){         
    firebase.initializeApp(environment.firebase);
  }
}  

2. Создайте специальный сервис для Firebase, в который вы будете импортировать библиотеку 'firebase' (это хорошее общее решение, которое, вероятно, будет использоваться в вашем приложении во всем мире).

@Injectable({
        providedIn: 'root' // <-- If you are on Angular 6
    })
    export class FbService {
        constructor() {
            firebase.initializeApp(environment.firebase);
        }
    }

Answer 2

Просто добавьте firebase.initializeApp(environment.firebase); вне модуля и класса, то есть:

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

firebase.initializeApp(environment.firebase);

@NgModule({....

Если вы хотите использовать его внутри базы импорта служб import * as firebase from 'firebase'; и использовать его как обычно.

Answer 3

Я бы сказал, что у вас эта ошибка, потому что firebase.initializeApp(environment.firebase) не является угловым модулем.

Я бы посоветовал вам выполнить эту инициализацию в одной из ваших служб или создать службу для этого эффекта.

@Injectable({
    providedIn: 'root'
})
export class FirebaseService {
    constructor() {
        firebase.initializeApp(environment.firebase)
    }
}