模块化Angular架构可最大程度地重复使用代码,但仍提供足够的灵活性

时间:2019-03-24 23:36:55

标签: angular asp.net-core modularity

作为一家开发公司,不同项目需要(几乎)相等的代码是很常见的。对模块化系统的需求变得越来越迫切,这样我才能最大限度地提高前端和后端的代码重用。

重要的是,我不想削减限制,这意味着客户几乎总是能够获得他想要的功能。如果事实证明该功能可用于其他业务案例,则可以将其包含在“主要”模块之一中,否则我们将(扩展/覆盖现有模块并创建一个单独的模块)。

后端

现在在后端我已经解决了这个问题,可能值得举一个例子来解释。

假设您有一个核心模块,一个电子商务模块和一个 Marketplace 模块。

  • 所有模块都需要一个门户/后台/管理面板。
  • 电子商务模块需要有一个专门的网上商店网络项目。
  • 市场模块需要有一个专用的市场网站项目。

我在C#中解决此问题的方式如下:

architecture back-end

因此,在上图中,您可以通过覆盖模块来查看模块中的控制器是否可扩展。所有域和应用程序逻辑都采用相同的方式(未显示):大多数事物都是虚拟化的,因此如果需要,我可以在一个业务项目中覆盖它。 因此,如果一个业务项目不能使用标准的“电子商务”模块满足要求,则可以扩展或创建其他逻辑/控制器来实现这些功能。

因此,对于 portal 应用程序,我认为没有问题。我可以根据设置轻松地延迟加载(角度)模块。对于所有业务案例,这可以是一个Web应用程序,不需要任何特殊照顾。因此,尽管它显示了两个单独的Portal Web应用程序,但它们最终将具有相同的角度前端代码。然后,它们将被分散在不同的服务器上。

前端

但是要转到网上商店市场模块/项目:

  • 它们可能都具有完全不同的设计。
  • 这两种方法都可以由不同的公司使用,它们各自具有独特的结帐/市场流程/设计。
    • 但是,在功能方面,加载产品,显示市场商品,注册/登录和付款在很大程度上是相同的。
  • 核心模块中创建并在门户中使用的某些组件也应该能够在webshop / marketplace应用中使用。

那么..我怎样才能正确地以角度(7)完成此操作?我到目前为止所知道的,到目前为止已经解决了。

业务项目之间的相似性

  1. 由于所有后端控制器都有固定的路由,因此http调用在所有项目中均相等。一个项目可以扩展后端控制器,使其行为有所不同,但这不会更改路由。如果一个项目需要偏离功能,那么很可能还需要一个单独的角度模块/组件。

  2. 某些企业可能希望显示稍微不同的组件(在门户中)。根据{{​​3}},可以通过使用特定于项目的style.less文件(无论如何是主布局颜色,都可能需要)或“覆盖/替换”组件来实现。

  3. 尽管网上商店和市场完全不同,但它们确实具有类似的功能,例如:登录,发票付款页面,显示发票详细信息,上传照片,日期时间选择器和国家/语言选择器+本地化。 / p>

  4. 有时需要额外的字段,这可以通过类似于CRM的方法来实现,方法是在数据库中进行配置,然后将其加载到单独的http调用中的视图中。

业务项目之间的区别

我看到了从小变化到大变化的几个“阶段”的差异:

  1. 小的设计更改:这仅需要对总体布局进行少量更改,并且可以通过更改公司特定的样式来实现。如果这还不够,或者需要在main style.less文件中添加大量代码,则我们希望替换component.less文件。示例:登录页面。
  2. 重大设计更改:组件功能相同,但需要完全不同的.html组件。例如:帐户资料页面。
  3. 功能更改:html和更少的文件实际上可以相等,但是在组件功能/行为方面需要从小到大的更改。例如:一个人可能想要自动保存数据,一个人可能想要一个确认按钮。
  4. 完成不同的组件:已解决,请参见2.相似之处。

其余问题

  1. 如何为特定组件加载其他样式?类似于为手机,平板电脑和台式机提供多个设计文件。但是基于环境变量吗?
  2. 如何为相同的组件功能使用完全不同的.html文件?
  3. 让每个公司的路由配置轻松切换到自定义组件而不是一个模块中的默认组件之一可能有用吗?
  4. 我如何构造文件夹? ASP.NET的核心方式是在Web项目中包含有角度的项目,但是当我想在所有不同的Web项目中共享组件时,我并没有真正看到它是如何工作的。我认为我确实更喜欢在Web项目中包含有角度的项目,因为它们相互之间很好地集成在一起,并且在不单独托管它们时还可以避免基于令牌的身份验证开销。

注意事项

我能想到的一种方法是创建自己的私有npm软件包,创建“核心”模块,“电子商务”模块和“市场”模块。然后让每个实际的业务项目都导入这些npm软件包。我想对于准备生产的代码来说,它可以工作,但是在开发过程中,我不确定它如何工作,这样我就不必在每次在其他项目中使用它之前就发布我的软件包。为此,我仍然需要解决上述问题:导入模块后如何再次扩展/覆盖模块。如果我所有人都可以使用ng build --watch,那很好,但是我想在CI / CD中自动配置它时可能需要大量配置?还考虑到在测试一个项目期间它必须易于调试的事实。

基本上,我正在寻找最佳实践。到目前为止,由于“模块”和“角度”是并行的,因此很难找到解决方案,因此大多数解决方案仅专注于一个项目中的各个模块。

我对如何构造角度模块有一个架构草图:

this answer

0 个答案:

没有答案