Question

我创建了一个我遇到问题的项目的传真：

https://stackblitz.com/edit/angular-frlpmk

在这个项目中，我有两个延迟加载的模块：

客户
订单

客户模块依次延迟加载Address模块：

const routes: Routes = [
  {
    path: '',
    component: CustomerListComponent,
    children: [
            {
                path: 'addresses',
                loadChildren: './address/address.module'
            },
        ]
  }
];

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

我从这个JIT程序（通过stackblitz）获得的错误是：

errors.js:55 ERROR Error: Uncaught (in promise): Error: No NgModule metadata found for 'undefined'.
Error: No NgModule metadata found for 'undefined'.

当我用aot运行这个项目时，我得到：

ERROR Error: Uncaught (in promise): Error: Cannot find module './address/address.module'.
Error: Cannot find module './address/address.module'.
    at webpackAsyncContext (eval at ../../../../../src/$$_lazy_route_resource lazy recursive (main.bundle.js:6), <anonymous>:14:25)
    at SystemJsNgModuleLoader.loadAndCompile (core.js:6558)
    at SystemJsNgModuleLoader.load (core.js:6542)
    at RouterConfigLoader.loadModuleFactory (router.js:4589)
    at RouterConfigLoader.load (router.js:4569)
    at MergeMapSubscriber.eval [as project] (router.js:2061)
    at MergeMapSubscriber._tryNext (mergeMap.js:128)
    at MergeMapSubscriber._next (mergeMap.js:118)
    at MergeMapSubscriber.Subscriber.next (Subscriber.js:92)
    at ScalarObservable._subscribe (ScalarObservable.js:51)
    at webpackAsyncContext (eval at ../../../../../src/$$_lazy_route_resource lazy recursive (main.bundle.js:6), <anonymous>:14:25)
    at SystemJsNgModuleLoader.loadAndCompile (core.js:6558)
    at SystemJsNgModuleLoader.load (core.js:6542)
    at RouterConfigLoader.loadModuleFactory (router.js:4589)
    at RouterConfigLoader.load (router.js:4569)
    at MergeMapSubscriber.eval [as project] (router.js:2061)
    at MergeMapSubscriber._tryNext (mergeMap.js:128)
    at MergeMapSubscriber._next (mergeMap.js:118)
    at MergeMapSubscriber.Subscriber.next (Subscriber.js:92)
    at ScalarObservable._subscribe (ScalarObservable.js:51)
    at resolvePromise (zone.js:809)
    at resolvePromise (zone.js:775)
    at eval (zone.js:858)
    at ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:4740)
    at ZoneDelegate.invokeTask (zone.js:420)
    at Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1517)

无法找到地址模块，当我查看webpack输出时，Custmers.module在那里但没有地址：

 ** NG Live Development Server is listening on localhost:1234, open your browser on http://localhost:1234/ **
Date: 2018-03-15T17:08:51.053Z                                                          
Hash: 9a854b91e6ee905379c5
Time: 7314ms
chunk {customers.module} customers.module.chunk.js () 22.1 kB  [rendered]
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 25.6 kB [initial] [rendered]
chunk {orders.module} orders.module.chunk.js () 14.8 kB  [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 553 kB [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 37.8 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 9.5 MB [initial] [rendered]

我认为webpack无法找到这个模块。有没有一种方法可以将延迟加载的模块嵌套到另一个模块中？或者，有没有办法手动告诉webpack这个模块？

添加了此回购：https://github.com/jdell64/ngNestedLazyLoads

Answer 1

我认为你的路线应该是这样的：

const routes: Routes = [
    {
        path: '',
        component: CustomerListComponent
    },
    {
        path: 'addresses',
        loadChildren: 'app/customers/address/address.module#AddressModule'
    }
];

Angular Routes中的嵌套延迟加载

1 个答案: