Angular：多路径懒加载独立组件的实现方式是否正确？

这种写法是完全合规且正确的，你的实现没有问题，具体分析如下：

你给出的路由配置写法合法有效：

{ path: 'path1', loadComponent: () => import('./someComponent.component').then(c => c.someComponent)},
{ path: 'path2', loadComponent: () => import('./someComponent.component').then(c => c.someComponent)},

结合你在main.ts中配置的预加载策略：

provideRouter(APP_ROUTES, withPreloading(PreloadAllModules))

之所以会出现组件仅加载一次的情况，以及这种写法可行的原因：

• ES模块缓存机制：通过import()动态导入模块时，浏览器会对已加载的模块进行缓存。后续相同路径的import()调用会直接复用缓存内容，不会重复发起网络请求，这是你在DevTools中看到仅一次加载的核心原因。
• Angular路由的设计支持：Angular路由的loadComponent允许在多个路由中绑定同一个组件加载逻辑。当用户访问path1或path2时，都会复用已加载（或预加载完成）的组件资源，正常渲染组件。
• 预加载策略的适配性：PreloadAllModules会在应用启动后预加载所有懒加载资源（包括组件级懒加载），所以该组件会被提前加载一次，后续访问两个路由时不会再触发加载请求。

这种写法非常适合需要在多个路由下复用同一组件的场景，是合理的实践方式。

内容的提问来源于stack exchange，提问作者Daniel