Angular2：如何创建模块化应用程序？答案

【问题标题】：Angular2 : How can I create a modular application?Angular2：如何创建模块化应用程序？
【发布时间】：2020-07-27 16:35:13
【问题描述】：

我需要根据以下原则创建一个模块化应用程序：

应用程序的核心：在应用程序中随处可用的一组服务/组件（应用程序的核心）。例如，它将包含用户标识、记录事件的能力、SASS 的全局设计、文件管理器、打印管理器......所有必需的元素都将在核心中开发。
一些可选插件可以添加到该核心。例如，这将为核心应用程序带来一些新功能或使通用核心适应特定用例。插件必须使用核心的元素（例如插件日志事件与核心的日志管理器）。
核心首先执行并在启动时加载现有插件。
核心是单独设计、开发和编译的，没有任何插件。
每个插件都是单独设计、开发和编译的，但可以使用核心应用程序的一些服务/组件。
我可以根据用户需要安装或删除插件。

据我目前的了解，我注意到 Angular2+ 可以实现这样的概念：

在同一模块的其他组件内的组件和插件中创建核心（angular2+ 基本用例）：没有投诉
在模块中创建核心并在不同模块中创建插件：没有抱怨，因为我仍然需要将所有内容编译在一起，结果构建在全局 js 文件中。
创建多个嵌套在一起的 Angular 应用（基于该解决方案：Is it possible to nest Angular2 applications），但似乎该解决方案并未真正受到控制。

我真的没有其他想法，有人有建议吗？

【问题讨论】：

我认为这就是 modules 和 lazy loading 的用途。你看了吗？
I'm not sure that Angular 2+ can fullfill such concept ：可以。其实任何JS框架都可以。决定性因素是你如何编码，而不是你使用什么。只需read the documentation 即可查看您是否喜欢 Angular，如果不喜欢，请不要使用它。
回答您的三个对立点：Angular 可以管理插件和核心模块。只需为每个插件创建一个模块就可以了。您可以推迟某些脚本的加载，直到您到达特定的 URL，这样您就可以将插件与 dist 包分开。而且您不需要创建单独的应用程序。
@peter ：我感觉您将我的问题理解为对 angular2 的批评。我的问题显然不是批评，因为我已经基于该框架开发了一个 Web 应用程序，我真的很喜欢它。问题是我暂时不知道如何实现我的需求。
“我可以根据用户需要安装或删除插件。”是什么意思？特别是，您所说的“install”是什么意思？在这种情况下，什么是插件？你在问什么并不完全清楚。据我了解，除非我在这里理解错误，否则您应该能够使用 Angulars 模块功能并实现您想要的。

标签： angular

【解决方案1】：

最后经过一番调查，我的问题的解决方案是基于 @Angular/elements 提供的：

更多信息在这里：

【讨论】：

【解决方案2】：

模块化将取决于您的编码技能，Angular 以这种方式开始：

学习创建延迟加载的模块（有一些缺点 - 如果您不想从路由配置自动创建菜单，否则没关系）
拆分路由 - 在 app-routes 中，我确实有到延迟加载模块的路由，其余路由定义在子模块（或它的模块）内
尝试将相关的东西打包在一起
永远不要使用魔术字符串，使用 consts/enums
我确实在绑定时依赖 DTO 模型，如果您使用模型驱动方法，只需确保控件的名称与属性相同。我确实只将 DTO（数据）推送到组件中，我在该子组件之外的代码对子组件的编码方式没有任何假设（关注点分离，代码清晰）
找到一种方法来以一种简单可行的方式处理复杂的 UI 验证和验证错误显示 [这是最大的痛苦之一，您将看到的每个示例都将是不可重复使用的，过于具体...至少当我解决这个问题时就是这样]
确保使用流畅的设计方法（引导程序，始终考虑视口大小可能会改变或浏览器上的某个人正在使用您的代码）
购买（或使用免费的）UI 库包，最好是用 Angular 编写（所以不只是包装）。 Telerik 帮助我了解了如何创建 Angular 组件
如果是组件，请了解 ControlValueAccessor 是什么，这样您就可以创建 ngModel 可绑定组件！

【讨论】：