由于我用的是mac,以下的安装跟命令都会使用mac 的,window 需要自查
项目设计
背景
各种新旧项目,很多项目使用到了同一套业务代码或者是某些公用的组件等等。这些新旧项目之间,可能会出现:
- 开发环境的版本不同,即Node,npm,yarn 等等
- 依赖包版本的不同
- 可公用的代码,严重与现有项目中的其他代码进行耦合,导致提取困难
方案
基于以上的问题,最后我采用的是伪Monorepo的方案,相比与传统的monorepo,这种方式会更适合拿来在monorepo 之内集合新旧项目,如果按照传统的方式去整合新旧的项目,耗费太过巨大。
然后使用nx本身有的能力,来实现类似于workspace 的效果。
伪Monorepo:
- monorepo 的根目录空间只存放一些公共库,子应用全部剥离出 workspace 的管理。
- 各个子应用之内的依赖跟开发环境的版本都是独立的,各自管理自己的内容。
- 每个子项目都需要配置好volta,以便及时切换版本
初始化
安装volta
这个是我拿来做环境统一的一个工具,它能根据项目自动切换相应的环境,挺好用的。
# 安装
curl https://get.volta.sh | bash
# 设置默认的node 版本
volta install node@20.19.5
安装nx
直接查看官方文档安装吧,更详细
创建基础项目
运行npx create-nx-workspace@latest monorepo-uni-mp --packageManager=yarn
按以下选项创建项目
然后便会得到一个最基础的monorepo 项目
其中比较主要的有两个文件夹
packages公共库的文件夹apps存放子应用的文件夹
默认模板创建出来的这个项目已经能够运行常规的monorepo应用了,但是针对这种复杂的环境还要兼容uniapp的项目,特别是小程序端的,还需要做额外的配置。
项目设置
使用volta 设置monorepo 的环境
// 在 package.json 中添加以下配置
"volta": {
"node": "20.19.5",
"yarn": "4.12.0"
},
"packageManager": "yarn@4.12.0"
配置yarn
// 在 package.json 中添加以下配置
"workspaces": {
"packages": ["packages/*"],
"nohoist": []
}
这样设置之后apps文件夹就不再受到yarn workspace 的影响了。而packages文件夹依旧是在yarn workspace之中,依旧可以通过"package-a":"workspace:^"这种方式在 monorepo 中相互引用依赖。
现在,一个最基础并且支持uniapp 小程序开发的monorepo项目已经搭建好了,但是其中还会有很多问题:
- apps下储存着项目,时间长了会异常庞大
- 已存在的旧项目,集合到monorepo 之内,还需要做好兼容
- 由于apps 没有在
workspace中,公共库没法通过workspace:*引入到子应用之中 - apps 下的项目现在是各顾各的,开发起来需要一直手动切换,太过麻烦
期待问题解决,请稍后再看