Angular 延迟加载模块和共享模型类

Question

在我的应用程序中，我有很多简单的数据模型类。例如

export class Client {
   first_name: string;
   last_name: string;
   fullName(): string {
       return `${this.first_name} ${this.last_name}`;
   }
}

请注意，这不是 ClientService 提供者类。这些是在整个应用程序中使用的核心模型类。现在我想实现延迟加载的 ng 模块。 Angular docs 描述了如何共享组件、提供者、指令和管道。然而，有关于简单（非注释）类的注意事项。 Heros 示例有 an exported model class，但未在其模块之外使用。

我猜根模块应该导入所有模型类。然后功能模块应该只导入模型类声明。加载所有模块后应该有一个fullName() 方法定义。这是否意味着我应该为模型类定义一个模块？是否可以对非注释类执行此操作？

更新：我检查了 dist 目录中的文件。事实证明，客户端类方法不包含在延迟加载模块 (*.chunk.js) 中。但这是如何工作的？ Angular/Webpack 如何知道哪些类应该打包到 main.bundle.js 中，哪些打包到 chunk.js 文件中？

Answer 1

Webpack 进行全局应用程序源代码分析并保留 register 引用哪个类。如果一个类仅从 a lazy loaded module 引用，那么它会被打包到该延迟加载模块 (*.chunk.js) 中。

从主模块引用的公共类被打包到主包中。因此不存在于延迟加载的模块中，它们应该由主包加载。

NgModules（主加载和延迟加载）被视为依赖关系图的应用程序入口点。模型类不能被视为应用程序入口点，因此不需要注释它们（不需要额外的信息）。 Webpack 将完成解决依赖关系的所有繁琐工作。