如何将路由中的lazyload模块更改为普通模块?

时间:2017-06-08 09:17:16

标签: angular

版本:

ng version:
@angular/cli: 1.0.0-rc.1
node: 6.10.2
os: win32 x64
@angular/common: 4.1.1
@angular/compiler: 4.1.1
@angular/compiler-cli: 4.1.1
@angular/core: 4.1.1
@angular/forms: 4.1.1
@angular/http: 4.1.1
@angular/platform-browser: 4.1.1
@angular/platform-browser-dynamic: 4.1.1
@angular/router: 4.1.1
@angular/cli: 1.0.0-rc.1

我的项目过去常常在路由中使用lazyload模块,例如:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

export const routes: Routes = [
  { path: 'global-config', loadChildren: 'app/modules/act-widget/main.module#GlobalConfigModule' }
];

但是我们有太多的lazyload模块。它使我们的构建过程缓慢(92%的块资产优化)。 所以我们决定丢弃lazyload模块。

但是当我改变这个时:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import {GlobalConfigModule} from '../modules/global-config/global-config.module';

export const routes: Routes = [
  { path: 'global-config', loadChildren: () => GlobalConfigModule }
];

出现错误:

ERROR in Error encountered resolving symbol values statically. Function calls are not supported. Consider replacing the function or lambda with a reference to an exported function (position 12:42 in the original .ts file), resolving symbol routes in E:/pgg_oa/src/app/container/container-routing.module.ts, resolving symbol AppRoutingModule in E:/pgg_oa/src/app/container/container-routing.module.ts, resolving symbol AppRoutingModule in E:/pgg_oa/src/app/container/container-routing.module.ts, resolving symbol AppRoutingModule in E:/pgg_oa/src/app/container/container-routing.module.ts

我的问题是:

如何以最低的成本将lazyload模块更改为普通模块?

1 个答案:

答案 0 :(得分:1)

您应该创建一个导出的函数,并将其用作loadChildren值。问题是,你必须为每个模块创建一个函数:

export function getGlobalConfigModule(): typeof GlobalConfigModule {
   return GlobalConfigModule;
}

export const routes: Routes = [
  { path: 'global-config', loadChildren: getGlobalConfigModule}
];

应用程序的初始启动时间会慢很多,但我不确定你是否愿意做出这个决定。由于完成了AoT编译,构建过程需要很长时间。也许投资具有高I / O的新磁盘可以缩短构建时间