angular - 使用角度通用的角度服务器端渲染不适用于延迟加载模块
问题描述
我有一个 Angular 版本 7 的现有 CLI 项目。我需要为 SEO 和社交共享元标记使用设置服务器端渲染。
我遵循 https://angular.io/guide/universal 中给出的官方指南,并从 git 存储库https://github.com/angular/angular-cli/wiki/stories-universal-rendering中获得一些帮助。
我安装了所有 NPM 模块并按照上述两个链接执行步骤,但是当我尝试使用以下命令构建包时
ng run web:server
它给了我一个错误。
截图:https ://www.screencast.com/t/J2d0AeGFnqt
app.server.module.ts
import {NgModule} from '@angular/core';
import {ServerModule} from '@angular/platform-server';
import {ModuleMapLoaderModule} from '@nguniversal/module-map-ngfactory-loader';
import {AppModule} from './app.module';
import {AppComponent} from './app.component';
@NgModule({
imports: [
// The AppServerModule should import your AppModule followed
// by the ServerModule from @angular/platform-server.
AppModule,
ServerModule,
ModuleMapLoaderModule // <-- *Important* to have lazy-loaded routes work
],
// Since the bootstrapped component is not inherited from your
// imported AppModule, it needs to be repeated here.
bootstrap: [AppComponent],
})
export class AppServerModule {}
app.routes
.
.
.
export const routes: Routes = [
{ path: 'reset_password/:token', data: { title: 'Reset Password' }, component: ResetPasswordComponent, canActivate: [AuthGuard] },
{
path: '',
component: LayoutComponent,
data: {
title: 'Home'
},
children: [
{
path: 'home',
loadChildren: './modules/home/home.module#HomeModule'
},
{
path: 'service-providers',
loadChildren: './modules/service-providers/service-providers.module#ServiceProvidersModule'
},
]
},
];
tsconfig.json
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"importHelpers": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
}
}
我的延迟加载模块不适用于角度通用。
请让我知道是否有人以前观察过这个问题以及任何想法。
解决方案
推荐阅读
- java - 尽管指定了文件扩展名,但上传到 Cloud Storage 的文件类型不正确
- java - jaxb 绑定 name 属性的自定义值
- javascript - Reactjs 不渲染本地图像
- go - 在 hugo 中按类别列出所有页面
- android-studio - 为什么外部共享库没有链接到我的 APK?
- c# - 对符号加载问题进行故障排除 - Visual Studio 2019 - Step Into 不再工作
- r - 无法使用 dplyr 计算百分比变化
- maven-3 - 解决 CheckStyle 插件中的依赖关系
- sql - 从 SQL 中的行级别值创建计算列
- python - discord.py 同时向多个人发送消息并接收他们的输入