pnpm,Monorepo的使用(2)

(二) monorepo

1. 什么是monorepo

monorepo 是把多个项目的所有代码放到一个 git 仓库中进行管理,多个项目中会有共享的代码则可以分包引用。整个项目就是有 root 管理的 dependencies 加上多个 packages,每个 package 也可以在自己的作用域引入自己的 dependencies。

pnpm,Monorepo的使用(2)_第1张图片

2. monorepo的工作目录
react-admin-vite-antd5
├─packages // 公共包存放路径
| ├─utils // 公共工具
| ├─ui // ui 组件库
| ├─store // 全局状态管理
| ├─hooks // 公共 hooks
| ├─eslint-config-custom // 全局 eslint
| ├─components // 公共业务组件
├─apps // 项目存放路径
| ├─demo // 示例项目
| ├─admin // 后台管理 app
| | ├─src // 主文件
| | | ├─routes // 路由
| | | ├─pages // 页面
| | | ├─components // 组件
| | | ├─common // 公共资源
| | | ├─assets 静态资源
| | ├─react-admin-vite-antd5 // 打包出口
├─.husky // 代码提交脚本
├─pnpm-workspace.yaml// 配置项目的workspace
packages:
  - 'apps/*'
  - 'packages/*'
在workspace中,packages下的工程都是可以独立操作的子工程,并且packages下的子工程是可以进行互联
3. 项目中引入package下的公共组件

通过pnpm add pj1 --filter pj2 可以将公共包下的pj1安装到项目的pj2中,查看pj2项目的package.json

"dependencies": {
  "pj1": "workspace:*"//因为pj1在worksapce中,所以会有workspace的前缀
},

你可能感兴趣的:(npm)