vue-demi打通pnpm替换npm导致的pinia使用问题

背景

项目最近做了一次大迭代，想要抛弃之前的东西做一次整体的优化，组里前端开发苦此久矣。

npm安装依赖时间长，项目有时候会出现某些依赖安装失败的情况，再次npm i之后还是进行下载，耗时如下：

使用公司的电脑还会受困于node版本的问题，新项目采用rspack，需要采用16以上版本的node才能正常运行，但公司电脑只能用14的版本进行安装依赖才能成功，虽说有nvm做版本管理，还是有些许的麻烦。

因此就想要用pnpm去替换npm安装依赖的方式。

npm安装依赖的时候，包与包之间是隔离的，因此会出现依赖重复下载的问题，加大了node_modules的体积，延长了依赖安装的时间。

yarn采用平铺的方式解决了npm递归嵌套的问题，但却出现了幽灵依赖的问题。

pnpm从根源上解决了这俩问题，在安装依赖时就进行了依赖去重，采用全局存储和符号链接机制 的方式解决了两者存在的问题，将重复的依赖挂载.pnpm``的目录下。

全程都是使用的node20版本

css 复制代码

npm i -g pnpm

复制代码

rimraf node_modules

css 复制代码

pnpm i

安装速度如下：

可以说减少了一半的时间，这还是在node20版本下，切换为其他项目npm就可能会需要3分钟的时间

将package.json文件中的依赖做一些改动，再次安装依赖的时间只需要34s

其他项目都基本是node14去跑，还可能会有node-sass这种依赖

这时候得使用pnpm@7以下的版本来安装

只要没有node-sass都可以直接用pnpm和node20的版本来做依赖的安装

rspack运行的项目会有缓存，所以一开始切换完之后启动项目没有任何问题出现，直到打包的时候出现了下列报错：

经过一番搜索，说是pinia版本过高的问题，于是调整pinia的版本为2.0.36，重新安装依赖

出现问题，原先的store的取值变成了ref的形式，导致原有的逻辑需要进行大改，还是还原成原来的pinia版本。

pinia的官方文档写了，pinia是可以支持vue2和vue3的，所以是有什么不知道的东西没去兼容

于是去翻找pinia版本的更新日志发现下列描述：

从2.1.0版本就需要vue3.3才可以使用或者是使用vue-demi的vue2版本，这个vue-demi是什么呢？

搜索一番后了解到vue-demi是为了让vue2的项目可以直接使用vue3的api，为了后续升级改造而添加的兼容工具，在pinia的依赖中也存在了这个工具，所以是pinia的vue-demi没有适配到当前项目的vue版本？

于是执行了以下命令去兼容这个问题：

arduino 复制代码

npx vue-demi-switch 2.7

但我们项目依赖中并没有这个东西，只是pinia自己的依赖有，这个命令执行了并没有效果，所以需要在package.json中增加：

json 复制代码

"vue-demi": "latest"

重新执行指定版本的命令，成功运行，并且打包也没有问题。

换了电脑可能不一定会记得要去执行vue-demi的命令，所以在运行命令中增加一条。

json 复制代码

 "dev": "npx vue-demi-switch 2.7 && rspack serve --config build/rspack.dev.conf.js"