在项目开发过程中,如何多人维护一个被多个项目使用的公共组件库的管理方案
简介
最近因为公司业务需求,要对项目组件库作为一个独立的项目库来维护,但是又不影响现有目录结构并且要易于日常多项目共同开发使用。
例如目前有A、B、C、D四个项目,每个项目都有一个组件库,但是每个组件库的组件其实是有相当一部分是重复的,因此想将组件提取出来作为一个单独的项目库来维护,
避免每次更新组件都要到四个项目都改一遍。
在需求分析过程中考虑了两种方案:一种是Npm 私库
,一种是Git Subtree
。下面会具体讲作用、优缺点及使用方法。
在需求的实现过程中觉得此需求非常有普遍意义,因此将本次实现历程整理分项出来,供大家最为相关业务需求时的小小参考。
git Subtree用来拆分巨石应用仓库也十分有效。
PS:本人github,欢迎交友
工程环境
+ Node
+ Vue项目(不限制必须是vue)
+ 使用Git管理项目(必要) 【 git Subtree 】
+ Verdaccio & pm2 【 npm私库 】
需求分析
- 多个项目共同开发,但是依赖某些相同的组件
- 在不同项目修改组件要自动同步到所有项目
- 要易用安全,并且尽可能的节省开发过程中的时间,不能增加学习成本或时间成本
方案一:Npm私库
在日常开发中我们都install过无数个轮子,很好的解决了日常项目工作中可能会用到很多通用性的代码,比如,框架类、工具类以及公用的业务逻辑代码等等,如果npm库里有解决方案,我们就可以很开森的用轮子啦,但是npm的性质是开源的,总有一些业务是私密程度比较高的或者公司压根就不允许将代码开源的,这时候就需要在公司服务器架设自己的npm私有仓库了。
相关知识:制作并发布一个npm插件 作者:Y2sh
优点
- 和日常npm install操作相同,简单易用
- 一次架设成本,后续直接使用即可,人员更换及人员水平变动没有影响
- 组件修改发布后,所有项目都能使用,并且可以指定版本
缺点
- 日常开发不便,需要将组件更新发布任何项目更新组件版本后才能看到效果
Npm私库使用教程 作者:Better
方案二:Git Subtree
git subtree是git的一条子命令,我们不用关注它具体释义是什么(参考百科),我们只讨论如何使用它来满足我们的需求。
Git Subtree可以将我们现在的工程目录中,选择我们指定的文件夹将其变成子仓库,这样这个目录就可以作为一个独立仓库推送到其它项目仓库中,来满足多个项目使用同一个组件库的目的。并且它关联到其他项目指定目录后,每个项目下的组件目录更新推送,其他项目都会收到更新。
优点
- 跟git的多人协作同理,关联后一个项目更新所有项目都可以收到推送
- 无需更改现有工程目录
- 组件更新所见即所得,调试效果拉满
缺点
- 多人协作,多项目关联,随意性较高,可能改本项目无意间影响了所有项目,因此使用必须给所有成员做培训说明
- 必须是使用git管理的项目
- 需要一定git相关知识,并且命令较长相对复杂
使用方式说明
demo
|---- app1
|--- components
|---- app2
|--- components
当仓库中衍生出多个项目时,那么多个项目必定有一部分组件库、样式库、工具类等是需要重复使用的。这个时候想把这部分抽离出来供多个项目共通使用时改怎么做?
百度大多是拆分仓库下子目录为子仓库,并且喜欢起同名造成迷惑性,这里详细讲解一下子组件库的拆分方式。
步骤如下:
-
拆分仓库
进入仓库根目录 git subtree split -P ./app1/components -b public-lib
-
创建新仓库文件夹,并初始化git
mkdir public-lib cd public-lib git init
-
拉取仓库代码到新的组件仓库!
git pull ../../demo public-lib "../../demo" 是原项仓库目录,因为拆分时已经指定了拆分路径,这里注意要写的是原仓库.git文件存在的位置 "public-lib" 是新仓库名字 注意:这么写是为了直观说明这句话都时什么意思,即从 原仓库 拉取到 新仓库
Git Subtree说明 作者:好好编程
Git Subtree操作教程 作者:库机戴娃
最终方案
考虑到上述两种方案的优缺点,最终决定在开发阶段使用Git Subtree
来管理维护组件库,上线后考虑使用Npm私库
管理。作者在尝试了两种方案后选择了以上三个教程作为案例分享,描述都比较详细或者直接明了(如有侵权,请联系作者删除)。
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。