数制前端整体架构概览

1. 子项目以及子模块

公司的整体项目是有多个模块构成的,比如物流管理、销售管理、人力资源管理 …… 如果将公司的所有模块作为一个整体项目来开发,那么维护代码库随着后面的模块开发将会变得越来越庞大,整个项目的上线也将变得逐渐难以控制。

因此我们为每个模块开了不同的 git 仓库来管理,以一个基座项目为基础,关联到所有的子项目。

但是每个子项目之前会有共用的代码,比如通用的组件、hooks、types 等,那么如何共享这些代码呢?我们引入了 git submodules 来连接多个模块库,这样只要公共部分的代码变更后,其他模块只需要调用 git submodule foreach git pull origin [branchName] 来拉取各个子模块的最新代码即可,这一行为可以使用 ci 在服务器端每天定时运行,保证公共代码统一是最新的。

所以整体的项目架构关系图如下:

2. 项目构建流程

在上述的项目架构上,我们是用 jenkins 来启动一个部署脚本来进行全量或者分量部署的。

对于前端而言,不同的租户我们会根据其域名来部署不通的前端页面,同时有些页面还需要不同的定制,如改变不同的主题色、不同的logo 等,这些定制需求也会在我们的项目打包过程中利用自动化脚本完成。但是所有的租户都是由同一个后台来管理的,同时我们拥有运营平台服务来管理每个租户的页面权限,在项目的打包过程中会参考运营平台该租户的权限配置来生成不同的页面。

整体流程如下: