Ошибка Angular 2: не удается найти функциональный модуль / путь

#angular #npm #lazy-loading

#угловой #npm #отложенная загрузка

Вопрос:

Режим разработки, ошибка консоли сообщает, что он « cannot find module user/user.module

Этот модуль функции лениво загружается в маршруты основных модулей приложения, но ошибка продолжает кричать мне в лицо. Я попытался динамически загрузить дочерний / функциональный модуль, но все равно получил сообщение об ошибке. Я тоже пробовал npm cache clean --force , но все равно не сработало. Я даже перезапустил свой компьютер! Я также пробовал другие решения, которые нашел в Интернете, но они не сработали. Чего мне не хватает или на что я не обращаю внимания ?!

Структура папок проекта:

 app
 |- AppModule.ts
 |- routes.ts
 |- and other.ts files
 |- user
    |- user.model.ts
    |- user.module.ts
    |- user.routes.ts
 

содержимое routes.ts (пожалуйста, обратите внимание на /user route/ отложенную загрузку:

 import { Routes } from '@angular/router'

export const appRoutes: Routes = [
    { path: 'user', loadChildren: './user/user.module#UserModule'}
]
 

содержимое user.module.ts

 import { NgModule } from '@angular/core'
import { CommonModule } from '@angular/common'
import { RouterModule } from '@angular/router'

import { userRoutes } from  './user.routes'

@NgModule({
    imports: [
        CommonModule, 
        RouterModule.forChild(userRoutes),
    ],
    declarations: [
    ],
    providers: [ ]
})

export class UserModule {}
 

содержимое user.routes.ts:

 import { P } from './p.component'
import { L } from './l.component'

export const userRoutes = [
    { path: 'p', component: P },
    { path: 'l', component: L }
]
 

Вот привязка [routerLink] в HTML

 <a [routerLink]="['user/l']">Get Help</a>
 

Полная ошибка:

 core.js:14597 ERROR Error: Uncaught (in promise): Error: Cannot find module 'user/user.module'
Error: Cannot find module 'user/user.module'
    at $_lazy_route_resource lazy namespace object:5
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:388)
    at Object.onInvoke (core.js:16156)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invoke (zone.js:387)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.run (zone.js:138)
    at zone.js:872
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:16147)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at resolvePromise (zone.js:814)
    at resolvePromise (zone.js:771)
    at zone.js:873
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:421)
    at Object.onInvokeTask (core.js:16147)
    at ZoneDelegate.push../node_modules/zone.js/dist/zone.js.ZoneDelegate.invokeTask (zone.js:420)
    at Zone.push../node_modules/zone.js/dist/zone.js.Zone.runTask (zone.js:188)
    at drainMicroTaskQueue (zone.js:595)
    at ZoneTask.push../node_modules/zone.js/dist/zone.js.ZoneTask.invokeTask [as invoke] (zone.js:500)
    at invokeTask (zone.js:1540)
 

Версии:

 Angular CLI: 7.1.2
Node: 8.11.2
OS: win32 x64
Angular: 7.1.2

@angular-devkit/architect         0.11.2
@angular-devkit/build-angular     0.11.2
@angular-devkit/build-optimizer   0.11.2
@angular-devkit/build-webpack     0.11.2
@angular-devkit/core              7.1.2
@angular-devkit/schematics        7.1.2
@ngtools/webpack                  7.1.2
@schematics/angular               7.1.2
@schematics/update                0.11.2
rxjs                              6.3.3
typescript                        3.1.6
webpack                           4.23.1
 

Спасибо!

Комментарии:

1. какую версию angular вы используете?

2. Версия Angular CLI: 7.1.2 Узел: 8.11.2

3. я спрашиваю об угловой версии, а не о версии cli. проверьте package.json.

4. Пожалуйста, попробуйте опубликовать чистый и понятный код. Ваш код не очень полезен. Также, пожалуйста, запустите ng --version из корня вашего приложения и опубликуйте все выходные данные. Версии CLI недостаточно. И последнее, но не менее важное, попробуйте это: { path: 'user', loadChildren: () => import ('./user/user.module').then(m => m.UserModule)

5. @AakashGarg, версия Angular: 7.1.2