Angular Development - loadChildren Duplicate Path Issue
·
1 min read
·
134
Words
·
-Views
-Comments
Angular development modularizes all resources. As web systems grow larger, lazy loading is often used to improve performance. However, due to design reasons, the following design situation may occur:
The specific lazy loading code looks like this:
Running this configuration will result in the following error:
ERROR in Duplicated path in loadChildren detected: "./security/security.module#SecurityModule" is used in 2 loadChildren, but they point to different modules "(/Users/heqiang/GitHub/angular-demo/src/app/parent/child/security/security.module.ts and "/Users/heqiang/GitHub/angular-demo/src/app/security/security.module.ts"). Webpack cannot distinguish on context and would fail to load the proper one.
Solutions
- In the official repository issues, the community suggested using absolute paths for configuration
- Modify module names and the folder names where modules are located. If they’re different, there won’t be a duplication problem
Analyzing this issue, it’s actually due to limitations in the official CLI tool. Hopefully future versions can resolve this.