lerna + dumi + eslint多包管理实践

旅行的意义

关注并将「趣谈前端」设为星标

每天定时分享技术干货/优秀开源/技术思维

背景

在开发大型项目时, 我们通常会遇到同一工程依赖不同组件包, 同时不同的组件包之间还会相互依赖的问题, 那么如何管理组织这些依赖包就是一个迫在眉睫的问题.

我们目前已有的方案有: Multirepo(多个依赖包独立进行git管理) 和 Monorepo(所有依赖库完全放入一个项目工程).

Multirepo的缺点在于每个库变更之后，需要发布到线上，然后在项目中重新安装, 打包, 发布, 最后才能更新，这样如果依赖关系越复杂就越难以维护。Monorepo最大的缺点就是不便于代码的复用和共享。

为了解决上述的问题, lerna 这款工具诞生了, 它可以方便的管理具有多个包的 JavaScript 项目。同时对于组件包的开发者和维护者, 为了让团队其他成员更好的理解和使用我们开发的组件, 搭建组件文档和 demo 就显得格外重要.

我们对以上提到的几点问题做一个总结:

• 大型项目中如何管理组织依赖包及其版本问题

• 如何高效低成本的搭建简单易用的组件文档

• 如何配置eslint代码规范和代码提交规范

接下来我将针对以上问题一一来给出解答. 如果大家想看实际的案例, 可以参考:

• best-cps | 基于lerna + dumi搭建的多包管理实践

大型项目中如何管理组织依赖包及其版本问题

这个问题主要用我上面的提到的 lerna 工具来解决. 目前我们比较熟悉的 babel, create-react-app, vue-cli 等都使用了 lerna.

在没使用 lerna 时, 我们不同库的组织形式可能如下: