网站 毕业设计代做,免费微商城平台官网,昆明公司网站优化,网站建设版面分几页合适1、历史原因解读
pnpm这个东西发布的时间是比较早的#xff0c;但是在最近一两年的时候才开始流行#xff0c;甚至是可以说非常的盛行#xff0c;那么这个包到底是个什么东西的#xff0c;那么我们先说下#xff0c;原来的包管理工具到底有那些问题#xff1f;比如说我们…1、历史原因解读
pnpm这个东西发布的时间是比较早的但是在最近一两年的时候才开始流行甚至是可以说非常的盛行那么这个包到底是个什么东西的那么我们先说下原来的包管理工具到底有那些问题比如说我们以前学习过 npm/yarn/cnpm/npx,这三个在安装我们一个包的时候有两个位置可以安装一个是局部一个全局那么我们来思考一下假如我们来安装一个包的时候比如说我们我们这里有一个项目为project01.现在我们来开发一个项目都是要通过webpack来进行打包的我们必然需要安装webpack,刚才我们在安装webpack的时候同时也帮我安装了几十个其他的包因为webpack本身也依赖其他的包但是真实开发你不能只用一个webpack,还有一些别的包babel/less/Vue/VueRouter/Vuex/Pinia/axios.等等一大堆的包…在我的电脑上我们不可能只开发一个项目我们会开发很多的很多的项目项目一、项目二、项目三一个电脑上是可能存在几个、到几十个、甚至上百个项目的这里的项目不是指正式的公司项目当然小公司可能就1-3个但是你学习阶段会创建不同的Demo项目也就是每个项目都需要一份对应的依赖库如果每个项目都是1个G的模块包。那么我们电脑上光这堆乱七八遭的依赖就非常的大。电脑不得炸掉npm\yarn都没有解决这个问题pnpm解决了这个问题。 2、什么是pnpm
什么是pnpm呢我们来看一下官方的解释 pnpm我们可以理解成是performant(高性能的) npm缩写
哪些公司在用呢
包括Vue在内的很多公司或者开源项目的包管理工具都切换到了pnpm 3、硬连接和软连接的概念
维基百科的解释当你不会一个技术需要学习时请先维基百科了解下最为准确的定义尽管他们晦涩难懂
硬链接hard link
硬链接英语hard link是电脑文件系统中的多个文件平等地共享同一个文件存储单元
删除一个文件名字后还可以用其它名字继续访问该文件
符号链接软链接soft link、Symbolic link
符号链接软链接、Symbolic link是一类特殊的文件
其包含有一条以绝对路径或者相对路径的形式指向其它文件或者目录的引用 快捷方式就是软连接、文件寻址找到对应的数据是硬链接
4、软链接和硬链接的测试演练
文件的拷贝
文件的拷贝每个人都非常熟悉会在硬盘中复制出来一份新的文件数据
window: copy foo.js foo_copy.js
macos : cp foo.js foo_copy.js文件的硬链接
window: mklink /H aaa_hard.js aaa.js
macos : ln foo.js foo_hard.js文件的软连接
window: mklink aaa_soft.js aaa.js
macos : ln -s foo.js foo_copy.js5、pnpm到底做了什么
当使用npm或Yarn时如果你有100个项目并且所有项目都有一个相同的依赖包那么 你在硬盘上就需要保存100 份该相同依赖包的副本。
如果是使用pnpm依赖包将被存放在一个统一的位置因此
如果你对同一依赖包使用相同的版本那么磁盘上只有这个依赖包的一份文件如果你对同一依赖包需要使用不同的版本则仅有版本之间不同的文件会被存储起来所有文件都保存在硬盘上的统一的位置 当安装软件包时 其包含的所有文件都会硬链接到此位置而不会占用 额外的硬盘空间这让你可以在项目之间方便地共享相同版本的 依赖包 为什么效率高因为应用了硬链接只是创建硬链接而不是从新下载而不用占用额外的磁盘空间
6、pnpm创建非扁平的node_modules目录
pnpm创建的是一个非扁平的node_modules目录这个也是pnpm的一个特点但是这个的话也并不是他脱颖而出的一个点但是确实是这个点还是有一点自己的特色的并且的话这个特点也算是他的优势之一。
那什么是扁平的node_modules呢
像我们最近用的npm,或者是yarn,他如果在安装很多包的时候他就是按照一种扁平化的方式在管理我们的包的我们观察通过npm安装的包发现包都是在node_modules这个目录下管理的如下图
解释
如果我安装webpack这个包那么webpack所需要的一些依赖包也是放在node_modules这个目录下的并不是在webpack目录下还存在一个node_modules,然后把依赖的其他包放进去早期的npm确实是按照这种方式进行管理但是会造成同一个包会安装很多次所以后来的话不管是yarn还是npm都将他变成了扁平式的从而避免重复下载的问题但是做成扁平化也是有一定的弊端的比如A包里边有C包但是我没有安装过C包C包却能通过代码编写的方式进行使用C包假如有一天我卸载了A包,C包也许就随之也被卸载掉了代码跑起来肯定会报错这是非常别扭、不规范、不安全的。pnpm解决了这个问题
当使用npm或 Yarn Classic安装依赖包时所有软件包都将被提升到node_modules的 根目录下。
其结果是源码可以访问 本不属于当前项目所设定的依赖包 7、pnpm的安装和使用
那么我们应该如何安装pnpm呢
官网提供了很多种方式来安装pnpmhttps://www.pnpm.cn/installation因为我们每个同学都要求安装过NodeNode中有npm所以我们通过npm安装即可
安装pnpm的命令
npm install -g pnpm检查pnpm的安装版本
pnpm -v注意2024-06-29,安装的pnpm的版本为pnpm9,但是他必须要使用node18,没办法我只能卸载掉因为我公司用的node才16版本。
卸载pnpm
npm uninstall pnpmpnpm与node的版本对应关系 更多命令和用法可以参考pnpm的官网https://pnpm.io/zh/
兼容性https://pnpm.io/zh/installation#%E5%85%BC%E5%AE%B9%E6%80%A7
pnpm与npm等价命令的对照表,帮助你快速入门 require,引入包查找顺序内容回顾
默认情况下会去查找是不是node的核心模块如果不是的话他就会去node_modules里边进行查找。我们观察通过pnpm安装的axios的那些依赖包是没有在
node_modules包下显示的所以他是一个非扁平化的node_modules
我们仔细观察axios这个目录我们会在他的右侧发现有一个小箭头表示为他是一个软链接
切记他并不是直接对远程仓库的npm仓库的包建立了一个软链接而是在你的每个目录里面都是有对应的硬链接的,只不过他是在我们node_modules里边给你建立了一个软链接那么你真实的文件到底在哪里呢其实是在.pnpm这个文件里边的
8、pnpm的存储store
在pnpm7.0之前统一的存储位置是 ~/.pnpm-score中的 在pnpm7.0之后统一的存储位置进行了更改/store
在 Linux 上默认是 ~/.local/share/pnpm/store在 Windows 上 %LOCALAPPDATA%/pnpm/store在 macOS 上 ~/Library/pnpm/store 为什么要做出这样的改变不能跨磁盘建立硬链接的。
**我们可以通过一些终端命令获取这个目录**获取当前活跃的store目录
pnpm store path**另外一个非常重要的store命令是prune修剪**从store中删除当前未被引用的包来释放store的空间
pnpm store prune
