pnpm相对于npm,yarn的优势

🔹 背景

npm:最早的包管理器,简单直接,但有依赖重复、安装慢的问题。

yarn:Facebook 推出,解决 npm 的速度、锁文件一致性问题。

pnpm:新一代包管理器,用 符号链接 + 内容寻址存储,更高效、更安全。

✅ pnpm 的优势(相比 npm / yarn)

1.磁盘空间优化(内容寻址存储,硬链接 + 符号链接)

npm/yarn 安装:把依赖完整复制到 node_modules,每个项目可能重复存储几百 MB。

pnpm 安装:

先把包放到 全局内容寻址存储(store)(类似 git 的 .git/objects)。

不同项目用 硬链接/符号链接 指向 store 的文件,而不是复制一份。
优势:多个项目共享依赖,节省 70-90% 磁盘空间。

2. 更快的安装速度

npm:逐级展开依赖,冗余、慢。

yarn:并行下载、缓存好,但依赖还是复制到每个项目。

pnpm:直接从全局 store 硬链接,避免重复下载 + 拷贝,速度更快。

典型表现:第一次安装 ≈ yarn,第二次安装(已有缓存)> yarn >> npm。

3. 严格的依赖管理(避免幽灵依赖)

npm / yarn:node_modules 会把依赖拍平,子依赖可能被 hoist(提升)到顶层,导致"幽灵依赖":

javascript 复制代码
// package.json 里没声明 lodash
import _ from 'lodash'; // 在 npm/yarn 下可能能跑

实际上 lodash 是某个依赖的子依赖,但被提升到顶层,代码能跑,但隐藏风险。

pnpm:依赖安装在 node_modules/.pnpm/... 下,每个包自己的依赖都放在独立目录。

如果你没有在 package.json 里声明 lodash,上面代码会直接报错。
优势:强制依赖显式声明,彻底避免幽灵依赖。

4. Monorepo 支持更好

pnpm 原生支持 monorepo(通过 pnpm workspace)。

特点:

跨项目依赖共享 store,更节省空间。

依赖解析和软链接天然支持 workspace。

跨包开发调试无需复杂配置(对比 yarn workspace / lerna,配置更轻量)。

5. 安全性与一致性更高

严格的依赖解析机制,避免不同环境下依赖结构不一致。

对锁文件(pnpm-lock.yaml)的解析更快、更稳定。

天然避免"某台电脑能跑、另一台跑不动"的问题。

6. 其他优势

pnpm fetch:可以先下载依赖(离线安装,CI/CD 更快)。

pnpm install --frozen-lockfile:保证依赖版本完全一致。

可配置性更高:支持 packageExtensions,修复三方库的错误依赖声明。

社区趋势:越来越多大厂和开源项目在转向 pnpm(例如 Vite、Next.js、Vue3 的仓库都推荐 pnpm)。

⚖️ 对比总结

特性 npm yarn pnpm
磁盘占用 高(重复) 高(重复) 低(全局 store + 链接)
安装速度 最慢 较快 最快(缓存 + 硬链接)
幽灵依赖 存在 存在 禁止,强依赖声明
Monorepo 支持 一般 支持 (workspace) 原生支持 (workspace)
锁文件一致性 npm5 之后改善 良好 更稳定
趋势 老牌 曾经火 逐渐成为主流
相关推荐
前端开发爱好者3 分钟前
“最新国产代码大杀器”——MiniMax-M2!
前端·javascript
小马哥编程30 分钟前
【软考架构】案例分析-web应用设计:SSH 和 SSM(Spring + Spring MVC + MyBatis ) 之间的区别,以及使用场景
前端·架构·ssh
用户1031133116635 分钟前
Vuex学习记录
前端
前端开发爱好者37 分钟前
Electron 淘汰!新的跨端框架来了!性能飙升!
前端·javascript
狮子座的男孩42 分钟前
js基础:08、构造函数(共享方法)、原型(prototype)、原型对象、(修改原型)toString方法、垃圾回收
前端·javascript·经验分享·prototype·垃圾回收·构造函数·原型对象
前端开发爱好者1 小时前
Vue 团队成员又搞了个 "新玩具"!
前端·javascript·vue.js
用户0136087566881 小时前
前端实现文件上传功能
前端
咖啡の猫2 小时前
Vue-github 用户搜索案例
前端·vue.js·github
yong99902 小时前
响应式布局新利器:CSS Grid 的 grid-template-areas 实战
前端·css
咖啡の猫2 小时前
Vue过度与动画
前端·javascript·vue.js