Pnpm,npm,yarn

npm

最初的npm只是简单的通过依赖去递归安装包,所以说每个依赖都会有自己的node_modules,node_modules是嵌套的。一个项目会存在多个包,多个包之间难免会有公共的依赖,node_modules嵌套的话,这样公共依赖就会下载多次。会造成磁盘空间的浪费,较长的下载时间,文件路径过长(windows文件路径最长是260多个字符,嵌套可能会超过其长度限制)

对于上述的缺点,在后面的版本效仿yarn的方式进行了解决

优点:官方支持;社区庞大;

Yarn

Yarn通过扁平化node_modules(同一个包,不同版本还是会嵌套下载。一个包是有多个版本的,只能提升一个),解决了公共依赖重复下载和文件路径过长的问题。还实现了yarn.lock来锁定版本。版本提升会照成幽灵依赖(是 项目里使用了,但是未在项目的package.json 中定义的包)

优点:并行下载,安装速度快;会缓存包,将包进行全局安装,所以支持离线模式,从全局安装的包里面深拷贝到当前项目;(区别于新的npm)

pnpm

当使用 npm 或者yarn时,如果你有 100 个项目,并且所有项目都有一个相同的依赖包,那么, 你在硬盘上就需要保存 100 份该相同依赖包的副本(yarn,拷贝了缓存的包)。如果是使用 pnpm,依赖包将被 存放在一个统一的位置(全局安装),如果你对同一依赖包需要使用不同的版本,则仅有 版本之间不同的文件会被存储起来。

扁平化的node_modules存在三个个问题: 模块可以访问它们不依赖的包;展开依赖关系树算法是相当复杂的;对于包的不同版本,只能提升一个,还是会存在嵌套的node_modules;

pnpm对于包是全局安装,每个项目的 node_modules 通过链接的形式将包链接到资源仓库中,这样不仅节省了空间,同时也加快了安装速度。

pnpm最大的优点就是保留了非扁平化的node_modules 文件夹,通过链接指向包资源的存储地。

ppm add axios,在node_modules下存在一个.pnpm的包,是硬连接指向包的磁盘地址;node_modules第一层还有一个axios,他里面也有node_modules,是软连接,指向.pnpm(硬连接就是同一个文件的不同引用,而软链接是新建一个文件,文件内容指向另一个路径)ps:路径过长的限制本质上是不能有太深的目录层级,现在都是各个位置的目录的 link,并不是同一个目录,所以也不会有长度限制

使用链接的指向,替代了yarn的复制,npm的下载,明显速度快了很多也更加节省了磁盘空间;同时也存在一个问题,如果你在一个项目内修改了一个包,那么其他依赖这个包的项目也会收到影响;

相关推荐
蓝婷儿2 分钟前
每天一个前端小知识 Day 21 - 浏览器兼容性与 Polyfill 策略
前端
百锦再4 分钟前
Vue中对象赋值问题:对象引用被保留,仅部分属性被覆盖
前端·javascript·vue.js·vue·web·reactive·ref
jingling5558 分钟前
面试版-前端开发核心知识
开发语言·前端·javascript·vue.js·面试·前端框架
拾光拾趣录13 分钟前
CSS 深入解析:提升网页样式技巧与常见问题解决方案
前端·css
莫空000014 分钟前
深入理解JavaScript属性描述符:从数据属性到存取器属性
前端·面试
guojl15 分钟前
深度剖析Kafka读写机制
前端
FogLetter16 分钟前
图片懒加载:让网页飞起来的魔法技巧 ✨
前端·javascript·css
Mxuan16 分钟前
vscode webview 插件开发(精装篇)
前端
Mxuan17 分钟前
vscode webview 插件开发(交付篇)
前端
Mxuan19 分钟前
vscode 插件与 electron 应用跳转网页进行登录的实践
前端