我的应用程序正在使用延迟加载功能来通过路由加载必要的模块。我的所有模块都是用tsconfig.json中声明的相同路由延迟加载的。它们中的大多数都能正常工作,但是由于某些原因,仍然会引发此错误。
ERROR Error: Uncaught (in promise): Error: Cannot find 'TemplateModule' in '@blockframes/material'
@ blockframes / material路径在tsconfig.ts文件中声明并引用了
"@blockframes/material": ["libs/material/src/index.ts"]
以相同的方式导入其他库,并且延迟加载的工作方式就像在它们上面一样。这里最奇怪的是,我从材质库中延迟加载了2个模块,而似乎只有一个模块没有错误。
这是我在app-routing-module中的路线的外观:
export const routes: Routes = [
{ path: '', redirectTo: 'layout', pathMatch: 'full' },
{
path: 'auth',
loadChildren: '@blockframes/auth#AuthModule'
},
{
path: 'layout',
component: LayoutComponent,
canActivate: [AuthGuard, OrganizationListGuard],
canDeactivate: [OrganizationListGuard],
children: [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{
path: 'organization',
loadChildren: '@blockframes/organization#OrganizationModule'
},
{
path: 'account',
// loadChildren: '@blockframes/account#AccountModule' // TODO this fail with "Error: Uncaught (in promise): Error: Cannot find 'AccountModule' in '@blockframes/account'"
loadChildren: 'libs/account/src/lib/account/account.module#AccountModule'
},
{
path: 'home',
canActivate: [MovieListGuard],
canDeactivate: [MovieListGuard],
loadChildren: '@blockframes/movie#MovieModule'
},
{ path: 'templates',
// loadChildren: '@blockframes/material#TemplateModule' // TODO this fail with "Error: Uncaught (in promise): Error: Cannot find 'TemplateModule' in '@blockframes/material'"
loadChildren: 'libs/material/src/lib/template/template.module#TemplateModule'
},
{
path: ':movieId',
canActivate: [MovieActiveGuard],
canDeactivate: [MovieActiveGuard],
loadChildren: '@blockframes/material#DeliveryModule'
}
]
},
{
path: 'not-found',
loadChildren: '@blockframes/ui#ErrorNotFoundModule'
},
{
path: '**',
redirectTo: 'not-found'
}
];
如您所见,@ blockframes / account也有同样的问题。您还可以注意到,@ blockframes / material#DeliveryModule成功地被延迟加载,如果TemplateModule具有与DeliveryModule相同的体系结构的话。
我意识到我可以将绝对路径更改为@blockframes路径(用于模板和帐户),并且该应用程序在重建后仍将运行。如果我停止服务器并ng serve
,将再次收到“找不到模块”错误。
我尝试重命名模块,因为材料可以是关键字,但是并不能解决问题。
非常感谢您的关注,如果您对此问题有任何疑问,我将很乐意尽快答复。
答案 0 :(得分:0)
似乎我们不能以相同的路径从同级ATLEAST的销售库中延迟加载两个模块,这似乎可行(直到有人找到解决这一问题的更优雅的方式)
在tsconfig.json中
"@blockframes/material": ["libs/material/src/index.ts"],
"@blockframes/template": ["libs/material/src/index.ts"]
在应用程序路由模块中
@blockframes/template#TemplateModule
作为奖励,一位同事告诉我,Angular 8将导入动态导入。我们可以这样导入:
import('@blockframes/material').then(x => x.TemplateModule)