javascript - Angular 5：使用 Angular-CLI 1.7.x 的 ng build --prod 時，Lazy Loading 無法正常運作

我正在以下主管之下工作：

• Angular：5.2.6
• Angular-CLI：1.7.x

我在應用程式下有這個路由檔案 （我在那裡有一些延遲加載模組） ：

const homeRoutes: Routes = [
  {
    path: 'home', component: HomeComponent,
    children: [
        ....
      {
        path: 'admin',
        loadChildren: 'app/home/admin/admin.module#AdminModule',
        canActivate: [AuthGuardAdmin]
      },
    ]
  },
];

@NgModule({
  imports: [
    CommonModule,
    RouterModule.forChild(homeRoutes)
  ],
  exports: [
    RouterModule
  ],
  declarations: []
})
export class HomeRoutingModule { }

在運行 ng serve 時，懶加載沒有起作用，並且我得到這個錯誤：

>     core.js:1448 ERROR Error: Uncaught (in promise): TypeError: undefined is not a function
>     TypeError: undefined is not a function

經過一些谷歌搜尋後，有人告訴我應該這樣改變我的延遲加載：

  {
    path: 'admin',
    loadChildren: ()=> AdminModule,
    canActivate: [AuthGuardAdmin]
  },

這在 開發模式 :) 下可以運作，但在執行 ng build --prod 時，它再次失敗並拋出這個：

ERROR in Error during template compile of 'HomeRoutingModule'
  Function expressions are not supported in decorators in 'ɵ0'
    'ɵ0' contains the error at app/home/home-routing/home-routing.module.ts(182,23)
      Consider changing the function expression into an exported function.

所以我恐怕無法讓它運作。

我不想因為其他原因而將 angular-cli 降級到 1.6.x。

所以有什麼方法可以修好它嗎？？

答案＃1

解決方案相當明顯。

對我來說，這是要在 app.module 中移除延遲加載的模組導入。由於它應該是延遲加載的，所以這是合理的。在這個討論串的某處找到了這個解決方案：https://github.com/angular/angular-cli/issues/9488 適用於 cli 版本 > 1.7.x

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    HttpClientModule,
    RouterModule,
    // custom modules
    AppRoutingModule,
    HeaderModule,
    LoginModule,
    Feature1Module, <!-- this is my lazyLoaded module // remove this line
    ConceptModule
  ],
  providers: [AuthService, AuthStoreService, AuthGuard],
  bootstrap: [AppComponent]
})
export class AppModule {
}

希望這能幫助其他人。