javascript - webpackasynccontext - uncaught(in promise): typeerror: undefined is not a function typeerror: undefined is not a function

Angular: Error: No capturado(en promesa) en webpackAsyncContext(eval at./src/$$_lazy_route_resource

Question

Estoy actualizando de Angular 4.0.0 a Angular 5.2.6

Me estoy enfrentando a un problema para que el módulo de carga lenta funcione.

con angular 4.0.0 , funciona bien, pero ahora, con 5.2.6 , aparece un error al hacer clic en mi botón de redireccionamiento:

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)

mi archivo de enrutamiento se ve así:

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

sugerencias ??

Answer 1

Como se menciona en https://github.com/angular/angular-cli/issues/9488#issuecomment-368871510 , parece funcionar con el ng serve --aot

Answer 2

Estaba enfrentando el mismo problema. Reiniciar el servidor angular ng-serve funcionó para mí.

Answer 3

Estoy experimentando el mismo problema. Esto podría ser un error con el ángulo-cli. ¡Todavía no estoy seguro de si el error está en el cli o en nuestro código! Como lo mencionó Gerrit , todavía es posible compilar con aot: ng serve --aot

También resolví el problema al degradar mi angular-cli de 1.7.2 a 1.6.8 , que es la última versión de CLI que parece funcionar en nuestro caso.

Answer 4

He cambiado el orden de las importaciones en mi app.module.ts como se menciona here

Así que necesitas tenerlo por ejemplo como este:

imports: [
  BrowserModule,
  FormsModule,
  HeroesModule,
  AppRoutingModule
]

Lo más importante es tener First BrowserModule y al final AppRoutingModule .

Answer 5

He resuelto este problema actualizando mt angular-cli localmente en devDependenices (package.json) de 1.2.0 a 1.6.7

Answer 6

No importe su módulo cargado de forma perezosa dentro de su app.module.ts principal. Esto causará una dependencia circular y lanzará el error que está recibiendo.

Answer 7

Tuve exactamente el mismo problema pero simplemente reiniciando el servidor de nodos (ng s) hice el truco por mí.

Como regla general: si el inicio angular se comporta de forma extraña, primero intente reiniciar el servidor de nodos

Answer 8

ng service --aot mientras compila su código, no es una solución, es solo un encubrimiento. Si determinó que no era la versión CLI, pruebe la solución a continuación.

Lo que debe hacer es asegurarse de que en su app.module.ts no está cargando su módulo cargado perezoso.

Por ejemplo:

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

Asegúrese de que YourFeatureMOdule se está cargando a través de las routes es decir:

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

Espero que esto ayude