我正在使用angular cli AoT编译。当我尝试在此tutorial之后创建一个延迟加载组件时，我得到以下错误：
ERROR Error: Uncaught (in promise): TypeError: __webpack_require__.e is not a function
TypeError: __webpack_require__.e is not a function
at webpackAsyncContext (eval at ./src/$$_lazy_route_resource lazy recursive (main.bundle.js:13), <anonymous>:15:29)
at SystemJsNgModuleLoader.loadAndCompile (core.js:6554)
at SystemJsNgModuleLoader.load (core.js:6538)
at RouterConfigLoader.loadModuleFactory (router.js:4543)
at RouterConfigLoader.load (router.js:4523)
at MergeMapSubscriber.eval [as project] (router.js:2015)
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:13), <anonymous>:15:29)
at SystemJsNgModuleLoader.loadAndCompile (core.js:6554)
at SystemJsNgModuleLoader.load (core.js:6538)
at RouterConfigLoader.loadModuleFactory (router.js:4543)
at RouterConfigLoader.load (router.js:4523)
at MergeMapSubscriber.eval [as project] (router.js:2015)
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:4736)
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)
以下是我的代码的一部分：
APP-routing.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: 'listes', loadChildren: 'app/component/list/list.module#ListModule'}
];
@NgModule({
imports: [
RouterModule.forRoot(routes)
],
declarations: [],
exports: [ RouterModule ]
})
export class AppRoutingModule { }
列表routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { ListComponent } from './list.component';
const routes: Routes = [] = [
{ path: '', component: ListComponent }
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule]
})
export class ListRoutingModule { }
list.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { ListRoutingModule } from './list-routing.module';
import { ListComponent } from './list.component';
@NgModule({
imports: [
CommonModule,
ListRoutingModule
],
declarations: [ ListComponent ]
})
export class ListModule { }
app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { HeaderComponent } from './component/header/header.component';
import { FooterComponent } from './component/footer/footer.component';
import { AppRoutingModule } from './app-routing.module';
import { DetailModule } from './component/detail/detail.module';
import { HomeComponent } from './component/home/home.component';
@NgModule({
declarations: [
AppComponent,
HeaderComponent,
FooterComponent,
HomeComponent
],
imports: [
BrowserModule,
AppRoutingModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule {}
我已将其报告为Angular-cli问题。你可以找到它here。
是否有人遇到过同样的问题，并为此找到了解决方案？
相关错误：Angular 5 with Angular cli non-lazy loading modules in the router（尚未解决）。
建议的解决方案：https://github.com/gdi2290/angular-starter/issues/1936：
{ path: 'listes', loadChildren: () => ListModule } // it doesn't do lazy loading
重要信息：
Angular cli: 1.7.0
Angular: 5.2.0
致以我的问候
我使用您发布的GitHub代码克隆并重现了该问题。为了修复，你的@ angular / cli global和devDependencies包必须是1.7.2
npm remove -g @angular/cli
npm install -g @angular/[email protected]
npm remove @angular/cli
npm add @angular/[email protected] --save-dev
现在，devDependencies中的@ angular / cli包与全局版本匹配，并且在解决该问题时将其设置为1.7.2。
我遇到了同样的问题。我解决了它只是停止cli服务器并启动它。如果您正确完成了代码，则错误消失。
angular-cli 1.7.x上有一个开放的bug：https://github.com/angular/angular-cli/issues/9488#issuecomment-368871510
降级到1.6.8为我解决了这个问题。
我得到了相同的问题。使用它修复它
{path:'listes' ,loadChildren: ()=>ListModule} not {path:'listes' ,loadChildren: 'app/component/list/list.module#ListModule'}
请参阅1.7.x错误的评论。问题似乎是将延迟加载的模块导入AppModule。删除该导入为我解决了问题：https://github.com/angular/angular-cli/issues/9488#issuecomment-374037802
至于我，问题是在AppModule中的AppRoutingModule之后导入ChildModule。重新排序他们解决了我的问题。
根据我的问题，您可能在同一路由文件中的相同路由上延迟加载多个模块。我也遇到了类似的问题并更改了其中一条路线的名称
我遇到了同样的问题，并设法通过将我的延迟加载的模块添加到我的角度CLI配置文件（angular.json）来解决它。在这里看到我的答案：Angular 5 lazy loading Error: Cannot find module
在你的app.module.ts中，你导入了ListModule吗？
我遇到了同样的问题，并且能够通过从app.module.ts中的导入中删除延迟加载的模块来修复它