Angular 9路由给出无错误的空白页面

Question

我刚刚升级到Angular 9，并使用延迟加载创建了一些子路线。在进行这些更改之前，我的项目和路由可以正常运行，但是在这两项更改之后，只有我的HomeComponent路由（路径：“”）可以正常工作，但是如果我尝试单击指向其他路由的链接（使用routerLink），则只需不会重定向，并且如果我在浏览器中手动编写路由，它会给我一个空白页面，且没有错误。

总结：项目和路线运行正常，但是在创建了角度延迟加载路线后，唯一可行的路线是默认路线（HomeComponent），并且如果我尝试单击链接进行查找到其他路由没有任何反应，如果我在浏览器中手动键入这些路由，它将为我提供一个空白页面，没有任何错误。

app.module.ts


@NgModule(
  declarations: [
    AppComponent,
    HomeComponent,
  ],
  imports: [
    SharedModule,
    HomeModule,
    Mugan86GoogleAnalyticsModule.forRoot(analyticsId: 'XXX', showLog: false),
    AnimateOnScrollModule.forRoot(),
    BrowserModule.withServerTransition(appId: 'serverApp'),
    ServiceWorkerModule.register('ngsw-worker.js', enabled: environment.production),
  ],
  providers: [
    provide: ErrorHandler, useClass: RollbarErrorHandler,
    provide: RollbarService, useFactory: rollbarFactory
  ],
  bootstrap: [AppComponent],
  exports: [
    SharedModule,
    HomeModule,
  ]
)
export class AppModule

shared.module.ts

@NgModule(
  declarations: [
    FooterComponent,
    LoadingBallsComponent,
    NavbarComponent,
    ScrolledToDirective,
    TrackScrollDirective,
    TopArrowComponent,
    SnackbarComponent,
  ],
  imports: [
    BrowserModule,
    RouterModule,
    AppRoutingModule,
    BrowserAnimationsModule,
    CommonModule,
    FilterModule,
    ReactiveFormsModule,
    FormsModule,
    RecaptchaModule,
    AnimateOnScrollModule
  ],
  exports: [
    BrowserModule,
    CommonModule,
    FooterComponent,
    LoadingBallsComponent,
    NavbarComponent,
    FilterModule,
    AppRoutingModule,
    ReactiveFormsModule,
    FormsModule,
    RecaptchaModule,
    AnimateOnScrollModule,
    ScrolledToDirective,
    TrackScrollDirective,
    TopArrowComponent,
    SnackbarComponent,
    RouterModule,
    BrowserAnimationsModule]
)
export class SharedModule

home.module.ts

@NgModule(
  declarations: [
    CharacteristicsComponent,
    ContactComponent,
    HeaderComponent,
    MainDescriptionComponent,
    InfluencerPromotionComponent,
    SocialMediaComponent,
    BoxItemComponent,
    BandIconComponent,
    ServicesComponent,
  ],
  imports: [
    SharedModule,
  ],
  exports: [
    CharacteristicsComponent,
    ContactComponent,
    HeaderComponent,
    MainDescriptionComponent,
    InfluencerPromotionComponent,
    SocialMediaComponent,
    BoxItemComponent,
    BandIconComponent,
    ServicesComponent
  ]
)
export class HomeModule

app-routing.module.ts

export const routes: Routes = [
  path: '', pathMatch: 'full', component: HomeComponent, // no route specified
  path: '', component: HomeComponent,
  path: 'sobre-nosotros', loadChildren: () => import('./components/about-us/about-us.module').then(m => m.AboutUsModule),
  
    path: 'preguntas-frecuentes',
    loadChildren: () => import('./components/common-questions/common-questions.module').then(m => m.CommonQuestionsModule)
  ,
  path: 'sitemap', loadChildren: () => import('./components/sitemap/sitemap.module').then(m => m.SitemapModule),
  path: '**', component: HomeComponent, // fallback route (not found - 404)
];

@NgModule(
  imports: [RouterModule.forRoot(routes, initialNavigation: 'enabled', preloadingStrategy: PreloadAllModules)],
  exports: [RouterModule]
)
export class AppRoutingModule

作为示例，我将显示不起作用的路由之一的模块和路由模块：

about-us-module.ts

@NgModule(
  declarations: [AboutUsComponent],
  imports: [
    AppModule,
    CommonModule,
    AboutUsRoutingModule,
  ]
)
export class AboutUsModule

about-us-routing.module.ts

const routes: Routes = [path: '', component: AboutUsComponent];

@NgModule(
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
)
export class AboutUsRoutingModule

其他信息

tsconfig.json（angularCompilerOptions）

  "angularCompilerOptions": 
    "enableIvy": true,
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true

angular.json（aot）

"aot": true,

package.json（查看版本）

"dependencies": 
    "@angular/animations": "~9.1.9",
    "@angular/common": "~9.1.9",
    "@angular/compiler": "~9.1.9",
    "@angular/core": "~9.1.9",
    "@angular/forms": "~9.1.9",
    "@angular/platform-browser": "~9.1.9",
    "@angular/platform-browser-dynamic": "~9.1.9",
    "@angular/platform-server": "~9.1.9",
    "@angular/router": "~9.1.9",
    "@angular/service-worker": "~9.1.9",
    "@josee9988/filter-pipe-ngx": "^1.1.0",
    "@nguniversal/express-engine": "^9.1.1",
    "animate.css": "^3.7.2",
    "emailjs-com": "^2.4.1",
    "express": "^4.15.2",
    "mugan86-ng-google-analytics": "^1.1.1",
    "ng-recaptcha": "^5.0.0",
    "ng2-animate-on-scroll": "^2.0.0",
    "rollbar": "^2.16.2",
    "rxjs": "~6.5.5",
    "tslib": "^1.13.0",
    "zone.js": "~0.10.2"
  ,
  "devDependencies": 
    "@angular-devkit/build-angular": "~0.901.7",
    "@angular/cli": "~9.1.7",
    "@angular/compiler-cli": "~9.1.9",
    "@angular/language-service": "~9.1.9",
    "@nguniversal/builders": "^9.1.1",
    "@types/express": "^4.17.0",
    "@types/jasmine": "~3.3.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.4.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "^5.0.9",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~2.0.1",
    "karma-jasmine-html-reporter": "^1.5.4",
    "protractor": "^7.0.0",
    "ts-node": "~7.0.0",
    "tslint": "~5.15.0",
    "typescript": "~3.8.3"

我还有一个使用常春藤和子路径的项目，我只是按照与上述项目相同的步骤进行操作，但是发现了所描述的问题。

编辑

我刚刚删除了每条路线的延迟加载和模块/路由模块，该应用程序再次正常运行。因此肯定是问题是由延迟加载引起的功能。