将同一个文件中的不同对象导出到不同的 NgModule

Question

背景：

我正在开发一个应用程序，它将利用 angular 的延迟加载机制（我使用的是 7.2.0）。我有几个 feature-routing.module.ts 处理所述延迟加载模块的路由。

在 AppModule 方面，我想使用描述的模式 here；那就是从另一个导出（js）配置片段的文件中导入（js方式）部分路由数组（而不是创建许多不必要的路由模块-每个子路由没有特殊的提供者或服务-）。

问题： 如果我将应用程序路由配置中关于功能的部分与延迟加载模块的路由模块放在同一个文件中，从捆绑的角度来看会发生什么？

该文件导出了一个仅供延迟加载功能模块使用的路由模块，同时还导出了一些仅供应用程序路由模块使用的常量。那么整个文件（因此包括功能路由模块和其他对象）是否会被捆绑两次：一次进入应用程序模块，一次进入功能？或者 ng build 会聪明到仅将 const 与 app 模块捆绑一次，并且仅将功能路由模块与功能模块捆绑一次？

在我看来这是个好主意，因为所有特定功能的路由问题都在一个文件中，任何相关模块都会从那里使用它。我正在拼命减少我的文件数量，因为它已经失控了。

例如用户-routing.module.ts:

// This one is meant for the AppRoutingModule, and should only be bundled with that.
export const user_routes: Routes = [
    {
        path: 'users',
        loadChildren: './users/users.module#UsersModule'
    }
// ...
];
// The rest should only be bundled with the UsersModule and NOT with the app module
const routes: Routes = [
// ...
];
@NgModule({
  imports: [RouterModule.forChild(routes)],
  exports: [RouterModule]
})
export class UsersRoutingModule { }

Answer 1

Question: What happens from a bundling perspective if I put the part of the app's route config regarding the feature in the same file as the lazy loaded module's routing module?

将它们放在同一个模块中时不会出现构建问题。

So will the whole file (hence including BOTH the feature routing module and other objects) be bundled TWICE: once into the app module and once into the feature?

TypeScript 导入语句被 WebPack 映射到一个单个引用到一个包中。所以你不能通过多次导入来复制 TypeScript 源代码。

Or will ng build be so smart as to bundle only ONCE the const with the app module, and only ONCE the feature routing module with the feature module?

是的，它只会被捆绑一次，因为 TypeScript 就是这样处理它的。

看看 Angular 包检查器。这个工具可视化你的包里面有什么，它们使用什么以及它们有多大。它会让事情变得更清楚。

https://coryrylan.com/blog/analyzing-bundle-size-with-the-angular-cli-and-webpack

将同一个文件中的不同对象导出到不同的 NgModule

Export different objects from the same file to different NgModules

es6-modules

angular

ng-build