新项目就别用npm和yarn管理包了,是时候使用更优秀的pnpm了

前言

从刚开始入干前端项目就使用npmyarn管理包,但一直也有听过pnpm,直到最近做一个从零到一的Vue3项目,这个项目整个生态都用了最新的技术,那么npm必须也升级上更强大的pnpm啊。然后用了pnpm也有一段时间了个人感觉真的是真香啊,所以真心推荐,那就用这文章通过对比与npmyarn的优劣和pnpm用法细致告诉大家我为什么推荐使用pnpm

一、pnpm对比npm与yarn的优劣

pnpm 是一个高性能的包管理工具,是2016年由Zoltan Kochan首次发布的,是对 npmyarn 的性能和使用场景的优化。pnpm 的全称是 performant npm,看全称就知道是高性能的 npm的意思。它是由 npm和yarn 衍生而来,通过解决这两个工具潜在的 bug 和一些性能问题,实现了更快的速度和更高的效率,甚至占用的空间还更小。

1、pnpm的优势

(1)安装速度更快: pnpm更快,是因为它用了一个全局的链接系统来避免重复安装相同的模块。也就是说如果有多个项目需要同一个模块的同一个版本,那么pnpm 只会下载一次并复用到所有需要它的项目中。

(2)节省磁盘内存: 当你使用 npm或者yarn 时,假如你有 100 个项目,并且所有项目都有一个相同的依赖包,那你在硬盘上就要保存 100 份该相同依赖包。然而,如果使用了 pnpm依赖包,会将相同依赖存放在一个统一的位置,因此保存规则如下:

  1. 如果你对同一依赖包需要使用不同的版本,则仅有 版本之间不同的文件会被存储起来。例如,如果某个依赖包包含 100 个文件,其发布了一个新 版本,并且新版本中只有一个文件有修改,则 pnpm update 只需要添加一个 新文件到存储中,而不会因为一个文件的修改而保存依赖包的 所有文件。
  2. 所有文件都保存在硬盘上统一的位置。当安装软件包时,其包含的所有文件都会硬链接到这个位置,而不会占用 额外的硬盘空间。这让你可以在项目之间方便地共享相同版本的 依赖包。

(3)目录结构确定性: pnpm 保证了每次安装的时候都会产生完全相同的 node_modules 目录结构,这在持续部署的环境中特别重要,因为它确保了可预测性和一致性。

(4)并行和异步: pnpm支持并行化和异步操作,即在处理大型项目和比较复杂的依赖树时相当重要,因为它可以极大地减少等待时间。

2、pnpm的缺点

(1)兼容性: 以下是pnpm官方列出来对应版本对nodejs的兼容情况,明显不如npm或者yarn,这也是呼应标题为什么新项目才推荐的原因。

(2)社区支持和资源较差: npm或者yarn 由于历史原因拥有更成熟而广泛的社区支持和资源。也就是说在遇到问题时,网上寻找 npm或者yarn 的解决方案比 pnpm 更容易一些。

(3)硬链接的限制: pnpm 虽然硬链接可以节省磁盘空间,但在某些文件系统(例如:NTFS)或操作系统上,硬链接可能不受支持或有局限性,这可能影响 pnpm 的可用性,但实在不行时可以关闭硬连接,所以这个问题不大。

二、pnpm对比npm与yarn的具体用法

pnpmnpmyarn的命令是很相似的,但它们在一些细节和功能上存在小差异。下面是常用的 pnpmnpmyarn 命令的对比

(1)安装pnpm

csharp 复制代码
npm install -g pnpm
或
yarn global add pnpm

(2)查看版本

npm -v

pnpm -v

yarn -v

(3)安装所有依赖

css 复制代码
npm install 或 npm i  

pnpm install 或 pnpm i 

yarn install 或者 yarn i

(4)全局安装依赖

csharp 复制代码
npm install -g 包的名称

pnpm add -g 包的名称

yarn global add 包的名称

(5)添加指定依赖

csharp 复制代码
npm install 包的名称 或 npm i 包的名称   

pnpm add 包的名称

yarn add 包的名称

(6)卸载依赖

arduino 复制代码
npm uninstall 包的名称 或 npm rm 包的名称

pnpm remove 包的名称

yarn remove 包的名称

(7)更新依赖

sql 复制代码
npm update 或 npm up

pnpm up

yarn upgrade 包的名称

(8)运行脚本

arduino 复制代码
npm run <script-name>

pnpm run <script-name>

yarn run <script-name>

(9)查看包信息

npm info 包的名称

pnpm info 包的名称

yarn info 包的名称

(10)清理缓存

css 复制代码
npm cache clean --force

pnpm cache clean

yarn cache clean

(11) 查看过时的依赖

npm outdated

yarn outdated

pnpm outdated

小结

以上是对pnpm背景的介绍和与npmyarn性能和用法指令的差异对比,总体上说前者性能更好但兼容性不如后者,更适合比较新技术的项目。如果那里写的不对欢迎大佬们指点修正。

相关推荐
web150854159352 分钟前
vue 集成 webrtc-streamer 播放视频流 - 解决阿里云内外网访问视频流问题
vue.js·阿里云·webrtc
m0_748257185 分钟前
Spring Boot FileUpLoad and Interceptor(文件上传和拦截器,Web入门知识)
前端·spring boot·后端
桃园码工23 分钟前
15_HTML5 表单属性 --[HTML5 API 学习之旅]
前端·html5·表单属性
百万蹄蹄向前冲1 小时前
2024不一样的VUE3期末考查
前端·javascript·程序员
轻口味1 小时前
【每日学点鸿蒙知识】AVCodec、SmartPerf工具、web组件加载、监听键盘的显示隐藏、Asset Store Kit
前端·华为·harmonyos
alikami1 小时前
【若依】用 post 请求传 json 格式的数据下载文件
前端·javascript·json
wakangda2 小时前
React Native 集成原生Android功能
javascript·react native·react.js
吃杠碰小鸡2 小时前
lodash常用函数
前端·javascript
emoji1111112 小时前
前端对页面数据进行缓存
开发语言·前端·javascript
泰伦闲鱼2 小时前
nestjs:GET REQUEST 缓存问题
服务器·前端·缓存·node.js·nestjs