[英]Critical dependency: the request of a dependency is an expression (Angular CLI Warning)
In here, I'm trying to dynamically load lazy child routes inside a lazy routing module.在这里,我试图在惰性路由模块中动态加载惰性子路由。
For an example:例如:
const serverResponse = [
{
path: "transaction",
children: [
{
path: "finance",
modulePath: "./modules/finance/finance.module",
moduleName: "FinanceModule",
},
],
},
];
const routes: Routes = [];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class LoanOriginationRoutingModule {
constructor(private router: Router) {
this.router.events.pipe(take(1)).subscribe((event) => {
const parentRoute: any = this.router.config.find(
(route: any) => route.path === "loanoriginationLib/loanorigination"
);
serverResponse.forEach((item) => {
const childRoutes = item.children.map((subItem) => {
return {
path: subItem.path,
loadChildren: () =>
import(subItem.modulePath).then((m) => m[subItem.moduleName]),
};
});
parentRoute._loadedConfig.routes.push({
path: item.path,
children: childRoutes,
});
});
this.router.resetConfig(this.router.config);
});
}
}
Then, I will get this following warning in the console:然后,我将在控制台中收到以下警告:
Critical dependency: the request of a dependency is an expression
Also when I'm trying to access the finance module via the application, I will get the following error in the browser console:此外,当我尝试通过应用程序访问财务模块时,我会在浏览器控制台中收到以下错误:
core.js:6014 ERROR Error: Uncaught (in promise): Error: Cannot find module './modules/finance/finance.module'
Error: Cannot find module './modules/finance/finance.module'
at lib lazy namespace object:5
at ZoneDelegate.invoke (zone-evergreen.js:359)
at Object.onInvoke (core.js:39699)
at ZoneDelegate.invoke (zone-evergreen.js:358)
at Zone.run (zone-evergreen.js:124)
at zone-evergreen.js:855
at ZoneDelegate.invokeTask (zone-evergreen.js:391)
at Object.onInvokeTask (core.js:39680)
at ZoneDelegate.invokeTask (zone-evergreen.js:390)
at Zone.runTask (zone-evergreen.js:168)
at resolvePromise (zone-evergreen.js:797)
at resolvePromise (zone-evergreen.js:754)
at zone-evergreen.js:858
at ZoneDelegate.invokeTask (zone-evergreen.js:391)
at Object.onInvokeTask (core.js:39680)
at ZoneDelegate.invokeTask (zone-evergreen.js:390)
at Zone.runTask (zone-evergreen.js:168)
at drainMicroTaskQueue (zone-evergreen.js:559)
at invokeTask (zone-evergreen.js:469)
at ZoneTask.invoke (zone-evergreen.js:454)
The project's environment:项目环境:
_ _ ____ _ ___
/ \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _|
/ △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | |
/ ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | |
/_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___|
|___/
Angular CLI: 8.3.29
Node: 14.7.0
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
------------------------------------------------------------
@angular-devkit/architect 0.803.29
@angular-devkit/build-angular 0.803.29
@angular-devkit/build-ng-packagr 0.803.29
@angular-devkit/build-optimizer 0.803.29
@angular-devkit/build-webpack 0.803.29
@angular-devkit/core 8.3.29
@angular-devkit/schematics 8.3.29
@angular/cdk 8.2.3
@angular/cli 8.3.29
@angular/flex-layout 9.0.0-beta.31
@angular/material 8.2.3
@angular/material-moment-adapter 10.2.7
@ngtools/webpack 8.3.29
@schematics/angular 8.3.29
@schematics/update 0.803.29
ng-packagr 5.7.1
rxjs 6.4.0
typescript 3.5.3
webpack 4.39.2
Is there any way to achieve this?有什么办法可以做到这一点?
Thank you for your time and consideration.感谢您的时间和考虑。
The routes needs to be statically analyzable during build time by the compiler and bundler and hence why I'm getting the Critical dependency: the request of a dependency is an expression
warning and when browsing the application in the browser I'm getting Error: Cannot find module './modules/finance/finance.module' Error: Cannot find module './modules/finance/finance.module'
because it doesn't exist in the context of the bundled application.路由需要在编译器和捆绑程序的构建期间进行静态分析,因此我得到
Critical dependency: the request of a dependency is an expression
警告,当在浏览器中浏览应用程序时出现Error: Cannot find module './modules/finance/finance.module' Error: Cannot find module './modules/finance/finance.module'
,因为它在捆绑应用程序的上下文中不存在。
So now what I can probably do is to declare the routes statically.所以现在我可以做的就是静态声明路由。
Reference: https://github.com/angular/angular-cli/issues/20284#issuecomment-800075447参考: https://github.com/angular/angular-cli/issues/20284#issuecomment-800075447
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.