Firebase托管和seo上的Angular5 Universal延迟加载

问题描述

有人知道如何在Firebase主机上进行延迟加载吗?一切正常，但是当我查看站点的源代码时，我只看到路由器的插座，而不是文本等.我已将以下代码添加到函式文件夹中的index.js中:

Does anyone know howto get lazyloading on firebase hosting working?It all works but when I view the source code of my site, I only see the router-outlet and not the text and so on. I've added the code below to my index.js inside the functions folder:

extraProviders: [
  provideModuleMap(LAZY_MODULE_MAP)
]

我的app.server.module文件如下:

My app.server.module file looks like this:

import { NgModule } from '@angular/core';
import { ServerModule } from '@angular/platform-server';
import { AppModule } from './app.module';
import { AppComponent } from './app.component';

@NgModule({
imports: [
AppModule,
ServerModule
],
bootstrap: [AppComponent],
})
export class AppServerModule {}

但是当我在控制台中使用firebase deploy时，它已成功部署.但是，此后访问网站时，出现错误和空白页.

But when I use firebase deploy in my console, it has deployed succesfully. However when I visit my site after that, I get an error and a blank page.

因此，如果有人能指出我正确的方向，那真是太棒了！

So if anyone can point me to the right direction, that would be awesome !

推荐答案

可能是因为您在导入中缺少ModuleMapLoaderModule模块

It may be because you are missing the ModuleMapLoaderModule module in your imports

app.server.module.ts

import {ModuleMapLoaderModule} from '@nguniversal/module-map-ngfactory-loader'

@NgModule({
imports: [
AppModule,
ServerModule,
ModuleMapLoaderModule
],

对于延迟加载的路由似乎是必需的:

It seems to be needed for lazy loaded routes:

https://angular.io/guide/universal#app-server-module

这篇关于Firebase托管和seo上的Angular5 Universal延迟加载的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！