1. 基本常用命令
查看依赖仓库
常用命令:
- pnpm init 初始化项目
- pnpm add xxx
- pnpm install
- pnpm uninstall
- pnpm remove
- pnpm link
- pnpm update
- pnpm import
2. 创建monorepo项目
- pnpm init初始化项目
- 创建main、web、common文件夹
- 初始化main、web使用npm init vite j进行创建,main创建成主项目vue,web创建两个子项目react-demo、vue-demo,common项目创建成公共的接口
- 根目录创建pnpm-workspace.yaml文件,定义项目
项目架构如下:
monorepo
├─web 子应用
| ├─vue-demo
| ├─react-demo
├─main // 主应用
├─common // 公共请求库
├─package.json
├─pnpm-workspace.yaml //定义应用
pnpm-workspace.yaml文件
packages:
# all packages in direct subdirs of packages/
- 'main'
# all packages in subdirs of components/
- 'web/**' # 如果是多个项目是需要/**
- 'common'
# exclude packages that are inside test directories
- '!**/test/**'
说明 * 和 ** 区别:
*匹配零个或多个字符。例如,packages/*将匹配packages/目录下的所有直接子目录。如果packages/目录下有子目录A和B,那么packages/*将匹配A和B。
**匹配零个或多个子目录。例如,components/**将匹配components/目录下的所有子目录,无论它们是直接子目录还是子目录的子目录。如果components/目录下有子目录A和B,而子目录A下又有一个子目录C,那么components/**将匹配A、B和C。
总结:
*匹配直接子目录或文件。**匹配所有子目录或文件。
3. 使用的好处
3.1 依赖安装问题
以前需要进入每一个项目中进行安装,现在最外层根目录 pnpm install 会安装所有项目的依赖。
查看依赖安装情况
最外层:
子项目都没有.pnpm
项目中:
所有的公共的依赖放在最外层
3.2 公共common项目可以用包的形式引入到其他项目中
pnpm -F/--filter react-demo dev
比如在main的项目中引入common中定义的函数,通过 pnpm -F main add common(-D 放入开发依赖中)引入,会以worksapce形式引入
如何在内层去安装最外层的依赖
使用 pnpm install -wD xxx根目录下dev依赖,
如果安装在packages下的子项目需要加入-F===-filter 项目名称 pnpm install -wD koa -F vue-demo