Angular: Ошибка: не удалось (в обещании) в webpackAsyncContext (eval at./src/$$_lazy_route_resource

Я обновляюсь от Angular 4.0.0 до Angular 5.2.6

Я столкнулся с некоторой проблемой, чтобы получить ленивую загрузку модуля.

с Angular 4.0.0, он отлично работает, но теперь, при 5.2.6, я получаю такую ​​ошибку при нажатии моей кнопки перенаправления:

core.js:1448 ERROR Error: Uncaught (in promise): TypeError: undefined is not a function
TypeError: undefined is not a function
    at Array.map (<anonymous>)
    at webpackAsyncContext (eval at ./src/$$_lazy_route_resource lazy recursive (main.bundle.js:27), <anonymous>:13:34)
    at SystemJsNgModuleLoader.loadAndCompile (core.js:6558)
    at SystemJsNgModuleLoader.load (core.js:6542)
    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 Array.map (<anonymous>)
    at webpackAsyncContext (eval at ./src/$$_lazy_route_resource lazy recursive (main.bundle.js:27), <anonymous>:13:34)
    at SystemJsNgModuleLoader.loadAndCompile (core.js:6558)
    at SystemJsNgModuleLoader.load (core.js:6542)
    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 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)

мой файл маршрутизации выглядит следующим образом:

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 { }

предложения

Ответы

Ответ 1

Я решил эту проблему, обновив mt angular -cli локально в devDependenices (package.json) от 1.2.0 до 1.6.7

Ответ 2

Не импортируйте ваш лениво загруженный модуль в ваш основной app.module.ts. Это вызовет циклическую зависимость и выдаст ошибку, которую вы получаете.

Ответ 3

Я изменил порядок импорта в моем app.module.ts как упомянуто здесь

Так что вам нужно иметь его, например, так:

imports: [
  BrowserModule,
  FormsModule,
  HeroesModule,
  AppRoutingModule
]

Наиболее важным является наличие первого BrowserModule и в конце AppRoutingModule.

Ответ 4

Решение 1

Порядок импорта имеет значение, поэтому import lazy loaded module сверху и router module на последнем месте. Поскольку мы выполняем отложенную загрузку, этот загруженный модуль должен существовать до того, как мы осуществим маршрутизацию.

imports: [
    BrowserModule,       
    HeroModule, // Lazy-loaded module

    AppRoutingModule
  ],

Решение 2

Обычно Angular CLI импортирует module в app-module когда он был сгенерирован. поэтому убедитесь, что lazy-loaded модуль не был импортирован в app-module

Ответ 5

У меня такая же проблема. Это может быть ошибка с angular -cli. Я все еще не уверен, что ошибка в кли или в нашем коде! Как упоминалось Gerrit, все еще можно скомпилировать с помощью aot: ng serve --aot

Я также решил проблему, понизив мой angular -cli от 1.7.2 до 1.6.8, который является последней версией CLI, которая кажется работать в нашем случае.

Ответ 7

ng service --aot то время как она компилирует ваш код, не является решением, это просто сокрытие. Если вы определили, что это не версия CLI, попробуйте следующее решение.

Что вам нужно сделать, это убедиться, что в вашем app.module.ts вы не загружаете свой лениво загруженный модуль.

Например:

app.module.ts
 imports: [
   ...
   AppRouterModule,
   FormsModule,
   YourFeatureModule, <--- remove this
   ...
 ]

Убедитесь, что YourFeatureMOdule загружается через routes т.е.

app-routing.module.ts
 loadChildren: '../app/feature.module#YourFeatureModule'

Надеюсь это поможет

Ответ 8

Столкнулся с той же проблемой. Перезапуск углового сервера у меня работал ng-serve.

Ответ 9

У меня была точно такая же проблема, но просто перезагрузка сервера узлов (ng s) сделала трюк для меня.

Как правило: если angular начинает вести себя странно, сначала попробуйте перезагрузить сервер узлов

Ответ 10

используйте вместо этого ng serve --aot. Обычно Angular CLI добавляет модуль Angular с ленивой загрузкой в AppModule при его создании.