Angular2将大型应用程序组织到较小的应用程序中

时间:2016-07-13 02:45:06

标签: angularjs angular

要解决的问题

在工作中,我继承了(遗留的)非常大的Web应用程序(跨越多个Scrum团队和开发团队)的所有权。当前大型应用程序的一个常见痛点是,每当其中一个Scrum团队更新其各自的应用程序区域时,该团队就必须部署整个应用程序。我们开始做的一件事是缓解这个问题,让团队在大型应用程序之外创建新功能,然后在大型应用程序中放置一个页面,对新应用程序进行ajax调用,并简单地将HTML注入大型应用程序应用程序。这样,团队可以在进行更改时部署新的小型应用程序,而无需部署整个大型应用程序(跨越其他团队)。

好消息

我们目前正在考虑重新编写/重新设计大型应用程序,从开发的角度来看,我的目标之一就是将其组织成更小的应用程序/代码库,这样每个团队都可以部署代码而无需部署一个跨越多个团队的大型应用程序。我计划实现这一目标的一种方法是利用多种服务来获取数据。这样就会引入一层分离。

从客户端的角度来看,我倾向于使用的技术之一是 Angular 2 ,特别是对于Angular 2提供的关注点的分离(组件,模板,指令等) 。我知道我可以将Angular 2应用程序分解为功能,组件等,但是,我相信,最终所有这些仍然必须存在于一个应用程序/代码库中,所有这些都可以一起部署。 Angular 2中是否有一种方法可以将大型门户/套件拆分为较小的应用程序,并让应用程序相互交互。例如,也许可以共享一个shell应用程序(用于布局和导航),但是,门户/套件的每个区域都可以分解为更小的应用程序?

非常感谢任何关于从Angular 2角度处​​理/构建此方法的最佳方法的想法。此外,如果这是明确的,从Angular 2的角度来看是不可能的,这也是有用的信息。

提前致谢!

1 个答案:

答案 0 :(得分:0)

我会尝试从多个角度提供帮助。

  1. 考虑将Angular组件用作具有“Angular Elements”的自定义元素 - 请查看:https://medium.com/vincent-ogloblinsky/export-angular-components-as-custom-elements-with-angular-elements-a2a0bfcd7f8a
  2. 如果此方法不符合您的需求,并且您只能只提供一个角度应用程序,请尝试:

    1. 如果某些应用程序页面可以在不同的选项卡中打开并独立存在 - 请考虑将这个巨大的应用程序拆分为更小的模块化角度应用程序。用户不必注意到差异。如果你想为所有标签使用相同的网址 - 从反向代理服务应用程序。

    2. 如果流程中没有外部选项卡,那么您可能无法将角度应用程序拆分为较小的应用程序,但您可以使用模块化结构构建应用程序,以便每个团队采用不同的应用程序上下文(单独的功能文件)和一个团队将采用“共享”和“核心”实体。每个团队都可以拥有一个单独的分支机构,只有团队特权,只有FE负责人可以批准PR进入主人。

    3. 我还没有尝试的另一个选择是将功能代码拆分为不同的存储库 - 但是这样你就必须投入一些预编译脚本,这些脚本可以从每个repo中提取代码启动应用程序。

    4. 如果这里有一些服务器端逻辑 - 导出到不同的微服务。

      1. 我看到你提到了一些HTML注入 - 我不确定你打算怎么做,但考虑使用模板引擎。