pnpm原理

前置知识

硬链接(Hard Link)

linux 硬链接生成命令(windows网上搜一下)

bash 复制代码
ln [源文件] [目标链接]

试验

新建源文件

输入命令(根据自己想在的路径来)

bash 复制代码
ln /Users/xuweijie/Desktop/test/pnpm-demo/源文件.txt  /Users/xuweijie/Desktop/test/pnpm-demo/硬连接1.txt

多出了一个(硬连接1.txt)文件

接下来我们修改硬连接1.txt

查看源文件.txt 会发现内容也自动变化了

结论

生成硬链接会把源文件"拷贝"一份文件,与普通拷贝区别,就是源文件和硬连接底层共享inode(更细的内容,AI一下),所以修改硬链接1内容,源文件的内容也会更新。

  • 硬链接不能用于生成目录
  • windows要注意不能跨盘使用(AI)
  • 硬链接不额外占用空间

软链接(符号链接 Symbol Link)

linux 软链接生成命令(windows网上搜一下)

bash 复制代码
ln -s [源文件] [软链接文件]

试验

新建源文件

输入命令

bash 复制代码
ln -s /Users/xuweijie/Desktop/test/pnpm-demo/src/软链接源文件.js /Users/xuweijie/Desktop/test/pnpm-demo/index.js

我们会发现右边有个小箭头 这就是软链接,类似于快捷方式

.pnpm

pnpm 安装vue、react

查看软链接路径

cd 进入node_modules

细节

上面图中node_modules下面的vue和react都是软链接,指向.pnpm, 这样有效避免"幽灵依赖"问题,比如vue依赖bable,在项目中require('babel'),因为依赖会在.package.json的目录node_modules扁平化寻找,同级是找不到babel,会报错, Module Not Found, 所以避免了幽灵依赖问题。 因为vue是软链接,import vue from vue 实际执行的是.pnpm下面的vue

下面看.pnpm内容

可以看到.pnpm的结构是

依赖名称@版本号/node_modules/依赖

拿vue举例子,这里的vue文件夹实际上是从全局存放在.pnpm-store/vue,去做硬链接"拷贝"到.pnpm/vue@3.5.19/node_module下面,这样就节省了磁盘空间

可以vue的依赖是@vue/** @vue/** 下面几个文件又是软链接

可以看到软链接又指向这里

那么如何执行到@vue的软链接呢

总结

由此可以得出结论,项目依赖通过软链接指向.pnpm下面的"依赖名称@版本号/node_modules/依赖" 这里的依赖是硬链接"拷贝"的.pnpm-store下面的对应版本号的依赖,而"依赖名称@版本号/node_modules/依赖"的package.json的依赖在同目录下生成软链接指向.pnpm的同名依赖,依次循环

相关推荐
前端大卫2 小时前
Vue3 + Element-Plus 自定义虚拟表格滚动实现方案【附源码】
前端
却尘3 小时前
Next.js 请求最佳实践 - vercel 2026一月发布指南
前端·react.js·next.js
ccnocare3 小时前
浅浅看一下设计模式
前端
Lee川3 小时前
🎬 从标签到屏幕:揭秘现代网页构建与适配之道
前端·面试
Ticnix3 小时前
ECharts初始化、销毁、resize 适配组件封装(含完整封装代码)
前端·echarts
纯爱掌门人3 小时前
终焉轮回里,藏着 AI 与人类的答案
前端·人工智能·aigc
twl3 小时前
OpenClaw 深度技术解析
前端
崔庆才丨静觅3 小时前
比官方便宜一半以上!Grok API 申请及使用
前端
星光不问赶路人3 小时前
vue3使用jsx语法详解
前端·vue.js
天蓝色的鱼鱼4 小时前
shadcn/ui,给你一个真正可控的UI组件库
前端