1. 以 pnpm 构建 monorepo
monorepo 是一个项目仓库，里面可以存放多个项目，每个项目可以独立管理，并且可以共享依赖。
pnpm 全称 performant npm，意思为高性能的 npm。pnpm 由 npm/yarn 衍生而来，解决了 npm/yarn 内部潜在的 bug，极大的优化了性能，扩展了使用场景。
1.1 全局安装 pnpm
npm install -g pnpm
然后在项目下使用 pnpm init 进行 package.json 的初始化,得到 package.json 初始内容，然后把 package.json 中的 name 属性删掉，并且添加一个 “private”: true 属性，因为它是不需要发布的。
为了减少因node的版本的差异而产生开发环境错误，在package.json中增加engines字段来限制版本
为项目指定使用指定版本的node.js，在package.json中增加peerDependencies字段来限制版本
{
"private": true,
"scripts": {
},
"peerDependencies": {
"vue": "^3.2.0"
},
"engines": {
"node": ">=16"
},
}
1.2 配置 pnpm 的 monorepo 工作区
在这个仓库下，我们需要管理多个项目，就可以采用 pnpm 的 monorepo。在仓库的根目录下创建一个 pnpm-workspace.yaml 文件，可以在 pnpm-workspace.yaml 配置文件中指定这个仓库中有多少个项目。
packages:
- packages/*
- docs
- play
- internal/*
play 目录是示例项目，在开发的时候可以知道效果是否达到预期；
docs 目录是文档项目，展示组件的使用方法；
internal 目录是内部项目，存放一些私有组件，比如：打包方法、等；
packages 目录是所有组件的项目目录了，在 packages 目录中又可以放很多包的项目目录，比如，组件包目录：components、主题包目录：theme-chalk、工具包目录：utils 等。
然后每一个包目录里面也需要一个 package.json 文件进行声明这是一个 NPM 包目录。所以需要进入每个包目录进行初始一个 package.json 文件。
以 components 包为例，进入到 components 目录底下初始化一个 package.json 文件，更改包名：@vision-ui-vue/components。文件内容如下：
{
"name": "@vision-ui-vue/components",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC"
}
其他两个的包名则分别为：@vision-ui-vue/theme-chalk 和 @vision-ui-vue/utils，创建过程同上。
至此一个初步搭建的项目目录结构如下：
├── docs
├── packages
│ ├── components
│ │ └── package
