Appearance
背景
随着项目的增多,代码复用变得格外的重要,为了更加方便的管理好通用的js工具库和常用的一些ui组件,建立一个独立的仓库用来统一管理这些模块。
包划分思路
所有的包都放在packages文件夹下面,可以按照功能或者按照需求分,每一个包都单独有一个package.json文件,这样之后视情况可以发布到npm上面。 暂时有以下两个包:
@nw-design/ui封装的通用的ui组件库@nw-design/utils封装的通用的js方法
monorepo
所有的前端复用的包都放在一个仓库下面,避免每个包都要单独新建仓库以及下载大量依赖和构建工具,代码风格也可以全部统一
基于 monorepo 的仓库管理方式,我们能够更好的处理包和包之间的依赖关系,避免了以往单一仓库的一些痛点:
- 组件耦合严重,组件代码量大
- 业务开发分工不明确,业务开发人员要关心非业务的代码
- 编译慢,效率低
- 相关包基础依赖可能会重复打包,如: lodash,moment...
- 管理、调试、追踪bug困难
- 不同项目可能存在技术栈不统一,如:状态管理,less,sass
- 分支管理混乱
- 多包多项目之间依赖关系复杂
- 第三方依赖库版本可能不一致
- 占用总空间大
- 不利于团队协作
- 无法针对主应用统一跑测试用例,发布时很难避免一些基本的错误发生
- 需要频繁切换项目