背景
自从组内开发架构采用Monorepo大仓项目后，了解一些Monorepo的常用技术，主要采用了lerna框架去做多个子项目统一package.json命令脚本，因此想要了解一下lerna框架，同时也查到lerna的公司同步开发Nx项目，尝试一下它的应用。
想了解Monorepo大仓项目如何设计的可以翻到前往阅读 《从npm版本依赖到Monorepo大仓项目》。
lerna
是什么
Lerna是用于TypeScrip/JavaScript的原始monorepo工具。它已经存在多年，被数以万计的项目使用，包括Reaction和Jest。
了解Lerna，必须想要了解一下monorepo架构， 简单点说，monorepo架构就是将许多不同业务项目的归纳一个仓库中，抽取公共部分，降低版本依赖的复杂度，达到所有项目统一化的架构。
Lerna解决了monorepo架构以下问题：
- 将不同子项目链接在一起，不用发布npm就可以互相引用
- 可以将命令顺序执行，从而实现将不同项目分发到不同机器
- 参与CI/CD工作流中，拥有自由的定制脚本功能，从而满足不同的工作流
怎么做
主要有以下几个步骤：
- 初始化项目：
npx lerna init - 修改
package.json，去添加一个npm/yarn/pnpm workspace - 运行命令
lerna run xxx： 统一执行所有子项目的scripts命令，如：lerna run build
更加具体的操作，可以到官方文档去查看https://lerna.js.org/docs/features/run-tasks
Nx
先说明一下Nx与Lerna的关系：
Nrwl(开源构建系统NX背后的公司)已经接管了Lerna。NX是一个由前谷歌员工开发的构建系统，它利用了谷歌内部工具使用的许多技术。Lerna v5是这种新管理方式下的第一个版本，它更新了过时的包，并开始对存储库本身进行一些清理。从V5.1+开始，Lerna提供了集成NX的新可能性，并将许多任务调度工作推迟到NX。
是什么
官方介绍：
Nx是一个智能、快速和可扩展的构建系统，具有一流的Monorepo支持和强大的集成。
Nx的目标是：
- 加快你的前端项目工程化
- 提供一流的开发体验
实践-第一个nx项目
初始化项目，
npx create-nx-workspace@latest package-based --preset=npm添加子项目， 目录下新建标准npm项目
packages/is-even安装依赖，在根目录下执行
npm i typescript -D -W第一次编译，根目录下执行
npx nx build is-even新建第二个子项目，
packages/is-odd，在项目中引用is-even关联依赖，在根目录下执行
npm install，即可自动实现关联依赖项目编译依赖，在根目录
nx.json新增build依赖，如下：1
2
3
4
5
6
7
8{
...
"targetDefaults": {
"build": {
"dependsOn": ["^build"]
}
}
}编译打包，单独打包子项目
is-odd，命令npx nx build is-even，同时会编译打包is-even，因为引用了再次打包，nx会自动引入上一次build的cache缓存，从而加快编译速度
将所有的子项目统一打包编译，命令:
npx nx run-many --target=build如果不需要使用cache缓存，可以使用命令:
npx nx run-many --target=build --skip-nx-cache如果需要查看当前子项目依赖的项目是否被修改，可以使用命令：
npx nx affected --target=build
到此，一个Nx的Monrepo项目就完成了。
当然实际应用中，没有那么简单，后续我们将通过Vue(vite) 、 React去完成一个Nx项目，已经如何和现有的CI工作流结合运行。
同时我们还需要解决这些问题：
- 如何解决非Monrepo项目依赖Monrepo项目的公共代码
- 如何解决子项目需要发布，但是所依赖的其他子项目不发布问题
- 如何解决不同项目将采用不同的框架，如Vue、React，项目之间依赖问题？
- 如何解决不同子项目中依赖同一个npm包，但是版本不一致的问题？是通过前置检查？还是各自完全安装好？
- 实际应用中，如果遇到子项目需要单独剥离开成立单独项目，应该如何操作？
- 后续如果子项目越来越多，导致本地开发中项目运行开销过大，无法运行，如何解决？
- 子项目越来越多，是否有规范可以定义是否需要单独成立子项目？
- 如何定制公共代码剥离规则？如何检查规则应用？
- 前后端分离项目和SSR项目能否一起囊括？
- 项目权限问题如何解决？如：外包人员无法查看其它子项目代码？
- ……
我们有很多问题，但是基本上都是引入Monrepo大仓项目导致的问题，我们希望Nx能有相关的解决方案提供参考或者应用，减少我们实际开发的阻塞。
所以，Nx项目还是持续跟进研究学习，找个实际项目去落地实践，或者将现有一些项目去整合试试看。
- 本文作者： qborfy
- 本文链接： https://www.qborfy.com/today/20220119.html
- 版权声明： 本博客所有文章除特别声明外，均采用 MIT 许可协议。转载请注明出处！