离子SSR。无法加载使用NgxAuthFirebaseUIModule的页面

时间:2020-08-08 12:19:37

标签: angular firebase ionic-framework

我有一个带有ssr的简单ionic angular9应用程序。我正在尝试使用NgxAuthFirebaseUIModule通过Google连接授权,但是出现的问题是,一旦导入此模块,我就开始无休止地加载应用程序。从字面上看是不知道问题出在哪里...没有ssr,一切都会很好。

page.html

<ion-header>
  <ion-toolbar color="primary">
    <ion-buttons slot="start">
      <ion-back-button defaultHref="/"></ion-back-button>
    </ion-buttons>
    <ion-title>Details</ion-title>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ngx-auth-firebaseui-providers
    [theme]="themes.CLASSIC"
  ></ngx-auth-firebaseui-providers>
  <h2>{{ id }}: {{ data?.name }}</h2>
</ion-content>

page.module

import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { FormsModule } from "@angular/forms";

import { IonicModule } from "@ionic/angular";

import { DetailsPageRoutingModule } from "./details-routing.module";

import { DetailsPage } from "./details.page";
import { NgxAuthFirebaseUIModule } from "ngx-auth-firebaseui";

@NgModule({
  imports: [
    CommonModule,
    FormsModule,
    IonicModule,
    DetailsPageRoutingModule,
    NgxAuthFirebaseUIModule,
  ],
  declarations: [DetailsPage],
})
export class DetailsPageModule {}

app.module

import { NgModule } from "@angular/core";
import { BrowserModule } from "@angular/platform-browser";
import { RouteReuseStrategy } 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 { HttpClientModule } from "@angular/common/http";
import { BrowserTransferStateModule } from "@angular/platform-browser";
import { NgxAuthFirebaseUIModule } from "ngx-auth-firebaseui";
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
@NgModule({
  declarations: [AppComponent],
  entryComponents: [],
  imports: [
    BrowserModule.withServerTransition({ appId: "serverApp" }),
    IonicModule.forRoot(),
    AppRoutingModule,
    HttpClientModule,
    BrowserTransferStateModule,
    BrowserAnimationsModule,
    NgxAuthFirebaseUIModule.forRoot({
     my CONFIG
    }),
  ],
  providers: [
    StatusBar,
    SplashScreen,
    { provide: RouteReuseStrategy, useClass: IonicRouteStrategy },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

app.server.module

import { NgModule } from "@angular/core";
import {
  ServerModule,
  ServerTransferStateModule,
} from "@angular/platform-server";

import { AppModule } from "./app.module";
import { AppComponent } from "./app.component";

import { IonicServerModule } from "@ionic/angular-server";
import { FlexLayoutServerModule } from "@angular/flex-layout/server";
@NgModule({
  imports: [
    AppModule,
    ServerModule,
    IonicServerModule,
    FlexLayoutServerModule,
    ServerTransferStateModule,
  ],
  bootstrap: [AppComponent],
})
export class AppServerModule {}

0 个答案:

没有答案