当前位置: 首页 > news >正文

pnpm比npm、yarn好在哪里?

前言

pnpm对比npm/yarn的优点:

  • 更快速的依赖下载
  • 更高效的利用磁盘空间
  • 更优秀的依赖管理
    我们按照包管理工具的发展历史,从 npm2 开始讲起:

npm2

使用早期的npm1/2安装依赖,node_modules文件会以递归的形式呈现,严格按照package.json结构以及次级依赖的package.json将依赖安装到各自的node_modules中,直至次级依赖不再依赖其他模块

举例:

  1. foo -> bar,foo依赖于bar
node_modules
└─ foo├─ index.js├─ package.json└─ node_modules└─ bar├─ index.js└─ package.json
  1. foo1 -> bar,foo2 -> bar,bar会被安装两次
node_modules
├─ foo1
│  ├─ index.js
│  ├─ package.json
│  └─ node_modules
│      └─ bar
│          ├─ index.js
│          └─ package.json
└─ foo2├─ index.js├─ package.json└─ node_modules└─ bar├─ index.js└─ package.json
  1. 一些其他问题
    ● 依赖层级太深,会导致文件路径过长(windows 的文件路径最长是 260 多个字符,这样嵌套是会超过 windows 路径的长度限制的。)
    ● 这样的嵌套,重复的包被安装,导致node_modules文件体积巨大,占用过多的磁盘空间

当时 npm 还没解决,社区就出来新的解决方案了,就是 yarn:

npm3/yarn

yarn 是怎么解决依赖重复很多次,嵌套路径过长的问题的呢?
铺平。所有的依赖不再一层层嵌套了,而是全部在同一层,采用“扁平化”的方式去管理依赖,这样也就没有依赖重复多次的问题了,也就没有路径过长的问题了。

举例:

  1. foo1 -> bar,foo2 -> bar
node_modules
├─ bar
│  ├─ index.js
│  └─ package.json
├─ foo1
│  ├─ index.js
│  └─ package.json
└─ foo2├─ index.js└─ package.json
  1. foo1 -> bar@1.0.0,foo2 -> bar@2.0.0
node_modules
├─ bar@1.0.0
│  ├─ index.js
│  └─ package.json
├─ foo1
│  ├─ index.js
│  └─ package.json
└─ foo2├─ index.js└─ package.json└─ node_modules└─ bar@2.0.0├─ index.js└─ package.json

为什么还有嵌套呢?
因为一个包是可能有多个版本的,提升只能提升一个,所以后面再遇到相同包的不同版本,依然还是用嵌套的方式。

使用扁平化的方案,解决了npm2中出现的问题,但是也带来一些问题:

  1. 幽灵依赖
    就是明明没有在dependencies中声明的依赖,但是却可以require进来。很容易理解,就是依赖都铺平了,那依赖的依赖也是可以找到的。

出现幽灵依赖是有隐患的,比如:因为没有显式依赖,万一有一天别的包不依赖这个包了,那你的代码也就不能跑了,因为你依赖这个包,但是现在不会被安装了。

  1. 浪费磁盘空间的问题
    上面提到的依赖包有多个版本的时候,只会提升一个,那其余版本的包不还是复制了很多次么,依然有浪费磁盘空间的问题。

那社区有没有解决这俩问题的思路呢?
当然有,这不是 pnpm 就出来了嘛。
那 pnpm 是怎么解决这俩问题的呢?

pnpm

回想下 npm3 和 yarn 为什么要做 node_modules 扁平化?不就是因为同样的依赖会复制多次,并且路径过长在 windows 下有问题么?
那如果不复制呢,比如通过 link。
首先介绍下 link,也就是软硬连接,这是操作系统提供的机制。

  1. 硬连接就是同一个文件的不同引用,
  2. 而软链接是新建一个文件,文件内容指向另一个路径。
  3. 当然,这俩链接使用起来是差不多的。

如果不复制文件,只在全局仓库保存一份 npm 包的内容,其余的地方都 link 过去呢?

这样不会有复制多次的磁盘空间浪费,而且也不会有路径过长的问题。因为路径过长的限制本质上是不能有太深的目录层级,现在都是各个位置的目录的 link,并不是同一个目录,所以也不会有长度限制。

没错,pnpm 就是通过这种思路来实现的。

再把 node_modules 删掉,然后用 pnpm 重新装一遍,执行 pnpm install。
你会发现它打印了这样一句话:
预览
包是从全局 store 硬连接到虚拟 store 的,这里的虚拟 store 就是 node_modules/.pnpm。
只要是在同一台机器下,下次安装依赖的时候pnpm会先检查store目录,如果有你需要安装的依赖则会通过一个硬链接到你的项目中去,而不是重新安装依赖。这也就表明为什么pnpm性能这么突出了,最大程度的节省了时间消耗和磁盘空间。

我们打开 node_modules 看一下:
在这里插入图片描述

确实不是扁平化的了,依赖了 express,那 node_modules 下就只有 express,没有幽灵依赖。

展开 .pnpm 看一下:
预览

所有的依赖都在这里铺平了,都是从全局 store 硬连接过来的,然后包和包之间的依赖关系是通过软链接组织的。

比如 .pnpm 下的 expresss,这些都是软链接,
在这里插入图片描述

也就是说,所有的依赖都是从全局 store 硬连接到了 node_modules/.pnpm 下,然后之间通过软链接来相互依赖。

举例说明:

  1. 项目依赖foo@1.0.0
node_modules
├─ .pnpm
│   └─ foo@1.0.0
│        └─ node_modules
│            └─ foo -> <store>/foo
│                ├─ index.js
│                └─ package.json
│
└─ foo
  1. 项目依赖了foo@1.0.0、bar@1.0.0,bar也依赖了foo@1.0.0
node_modules
├─foo -> ./.pnpm/foo@1.0.0/node_modules/foo
├─bar -> ./.pnpm/bar@1.0.0/node_modules/bar
└─.pnpm├─ bar@1.0.0│   └─ node_modules│       ├─ foo -> ../../foo@1.0.0/node_modules/foo│       └─ bar -> <store>/bar└─ foo@1.0.0└─ node_modules└─ foo -> <store>/foo

为什么需要同软链接的方式去引用实际的依赖呢?其实这样设计的目的是解决“幽灵依赖”问题,只有声明过的依赖才会以软链接的形式出现在node_modules目录中,在实际项目中引用的是软链接,软链接指向的是 .pnpm 的真实依赖,所以在日常开发中不会引用到未在 package.json 声明的包。

官方给了一张原理图,配合着看一下就明白了:

预览

这就是 pnpm 的实现原理。
那么回过头来看一下,pnpm 为什么优秀呢?
首先,最大的优点是节省磁盘空间呀,一个包全局只保存一份,剩下的都是软硬连接,这得节省多少磁盘空间呀。
其次就是快,因为通过链接的方式而不是复制,自然会快。
这也是它所标榜的优点:

预览

相比 npm2 的优点就是不会进行同样依赖的多次复制。
相比 yarn 和 npm3+ 呢,那就是没有幽灵依赖,也不会有没有被提升的依赖依然复制多份的问题。
这就已经足够优秀了,对 yarn 和 npm 可以说是降维打击。
Workspace
现代前端工程中居多都是使用 Lerna 管理 monorepo 类型的项目,每个人都清楚它的作用,而 pnpm 也是对此进行了友好的支持。与 Lerna 不同的是 pnpm 使用特殊的包选择器语法限制命令,不像 Lerna 那样需要很长难记的命令去标识。

一个 monorepo 工程,目录中必须要拥有管理工作区的配置文件(pnpm.workspace.yaml),相比其它包管理工具的工作区文件其实都大同小异。

packages:# 所有在 packages/ 和 components/ 子目录下的 package- 'packages/**'- 'components/**'# 不包括在 test 文件夹下的 package- '!**/test/**'

一些常用于管理 monorepo 的命令:
● 精确选择一个 repo <@scope/package>,或选择一组 repo <@scope/*>,再或者相对路径选择。

pnpm dev --filter @byted-ehi/basic-list
pnpm dev --filter apps/*
pnpm dev --filter ./apps/admin-order-manage

● 选择一个 repo 以及所属 repo 的依赖项,例如:会运行 basic-list 下的所有依赖的 dev。这个命令的意思是在 @byted-ehi/basic-list 包的所有子目录以及这些子目录中的所有文件中执行开发脚本。

pnpm dev --filter @byted-ehi/basic-list...

● 只选择某个 repo 的依赖项,与上面的区别是不包含 repo。例如:会运行 repo 下所有依赖的 dev,不包含repo 本身。这个命令的意思是在 @byted-ehi/basic-list 包的所有子目录中执行开发脚本。

pnpm dev --filter @byted-ehi/basic-list^...

● 选择指定目录下的所有 repo。

pnpm dev --filter ./apps

总结
pnpm 最近经常会听到,可以说是爆火。本文我们梳理了下它爆火的原因:
npm2 是通过嵌套的方式管理 node_modules 的,会有同样的依赖复制多次的问题。
npm3+ 和 yarn 是通过铺平的扁平化的方式来管理 node_modules,解决了嵌套方式的部分问题,但是引入了幽灵依赖的问题,并且同名的包只会提升一个版本的,其余的版本依然会复制多次。
pnpm 则是用了另一种方式,不再是复制了,而是都从全局 store 硬连接到 node_modules/.pnpm,然后之间通过软链接来组织依赖关系。
这样不但节省磁盘空间,也没有幽灵依赖问题,安装速度还快,从机制上来说完胜 npm 和 yarn。
pnpm 就是凭借这个对 npm 和 yarn 降维打击的。

相关文章:

pnpm比npm、yarn好在哪里?

前言 pnpm对比npm/yarn的优点&#xff1a; 更快速的依赖下载更高效的利用磁盘空间更优秀的依赖管理 我们按照包管理工具的发展历史&#xff0c;从 npm2 开始讲起&#xff1a; npm2 使用早期的npm1/2安装依赖&#xff0c;node_modules文件会以递归的形式呈现&#xff0c;严格…...

大前端-postcss安装使用指南

PostCSS 是一款强大的 CSS 处理工具&#xff0c;可以用来自动添加浏览器前缀、代码合并、代码压缩等&#xff0c;提升代码的可读性&#xff0c;并支持使用最新的 CSS 语法。以下是一份简化的 PostCSS 安装使用指南&#xff1a; 一、安装 PostCSS 在你的项目目录中&#xff0c…...

全局UI方法-弹窗三-文本滑动选择器弹窗(TextPickDialog)

1、描述 根据指定的选择范围创建文本选择器&#xff0c;展示在弹窗上。 2、接口 TextPickDialog(options?: TextPickDialogOptions) 3、TextPickDialogOptions 参数名称 参数类型 必填 参数描述 rang string[] | Resource 是 设置文本选择器的选择范围。 selected nu…...

LibreOffice 将word,excel,PowerPoint文件转换PDF

安装LibreOffice并将Word和Excel文件转换为PDF文件&#xff0c;并设置文件存放路径的步骤如下&#xff1a; 1. 安装LibreOffice 如果尚未安装LibreOffice&#xff0c;可以通过以下命令在Ubuntu上安装&#xff1a; sudo apt update sudo apt install libreoffice 2. 使用Li…...

鱼眼相机的测距流程及误差分析[像素坐标系到空间一点以及测距和误差分析]

由于最近在整理单目测距的内容&#xff0c;顺手也总结下鱼眼相机的测距流程和误差分析&#xff0c;如果有错误&#xff0c;还请不吝赐教。 参考链接: 鱼眼镜头的成像原理到畸变矫正&#xff08;完整版&#xff09; 相机模型总结&#xff08;针孔、鱼眼、全景&#xff09; 三维…...

谈谈Python中的列表、元组、字典和集合的主要区别和用法

谈谈Python中的列表、元组、字典和集合的主要区别和用法 Python是一种功能强大且易于学习的编程语言&#xff0c;它提供了多种数据结构来支持各种编程需求。其中&#xff0c;列表&#xff08;list&#xff09;、元组&#xff08;tuple&#xff09;、字典&#xff08;dictionar…...

【WPF应用24】C#中的Image控件详解与应用示例

在C#应用程序开发中&#xff0c;图像显示是一个常见的需求。无论是创建图形界面还是处理图像数据&#xff0c;System.Windows.Controls.Image控件都是实现这一目标的重要工具。本文将详细介绍Image控件的功能、用法、优化技巧以及一些实际应用示例&#xff0c;帮助开发者更好地…...

CTF题型 php://filter特殊编码绕过小汇总

CTF题型 php://filter特殊编码绕过小汇总 文章目录 CTF题型 php://filter特殊编码绕过小汇总特殊编码base64编码string过滤器iconv字符集 例题1.[Newstarctf 2023 week2 include]2.[Ctfshow web 117] php://filter 是一个伪协议&#xff0c;它允许你读取经过过滤器处理的数据流…...

【嵌入式智能产品开发实战】(十二)—— 政安晨:通过ARM-Linux掌握基本技能【C语言程序的安装运行】

目录 程序的安装 程序安装的本质 在Linux下制作软件安装包 政安晨的个人主页&#xff1a;政安晨 欢迎 &#x1f44d;点赞✍评论⭐收藏 收录专栏: 嵌入式智能产品开发实战 希望政安晨的博客能够对您有所裨益&#xff0c;如有不足之处&#xff0c;欢迎在评论区提出指正&#xf…...

网络编程的学习1

网络编程 在网络通信协议下&#xff0c;不同计算机上运行的程序&#xff0c;进行数据传输。 三要素 ip&#xff1a;设备在网络中的地址&#xff0c;是唯一的标识。 ipv4:采取32位地址长度&#xff0c;分成4组。 ipv6&#xff1a;采用128位地址长度&#xff0c;分成8组。 …...

spark log4j日志文件动态参数读取

需要在log4j xml文件中设置动态参数&#xff0c;并支持spark任务在集群模式下&#xff0c;动态参数读取正常&#xff1b; 1.log4j配置文件 log4j2.xml <?xml version"1.0" encoding"UTF-8"?> <Configuration status"info" name&quo…...

设计模式,装修模式,Php代码演示,优缺点,注意事项

装饰模式&#xff08;Decorator Pattern&#xff09;是一种结构型设计模式&#xff0c;它允许动态地向一个现有对象添加新的功能或行为&#xff0c;而不改变其原始结构。在 PHP 中&#xff0c;可以使用类的继承和组合来实现装饰模式。下面是一个简单的 PHP 装饰模式示例代码&am…...

ubuntu下vscode ctrl+tab松开ctrl后不自动选中文件

vscode用ctrltab切换文件时&#xff0c;松开ctrl键后会自动选中切换的文件。 但是在ubuntu下发现有时不能自动选中切换的文件&#xff0c;需要再次按enter键才能打开文件。 经过测试发现解决方法有两个&#xff1a; 方法1&#xff1a;确认wayland状态&#xff0c;关闭wayland…...

【云开发笔记No.19】关于中台架构(1)

在云开发领域&#xff0c;中台架构是一种至关重要的组织架构&#xff0c;它为企业提供了一种灵活且高效的方式来应对市场的快速变化。下面将详细阐述中台架构的定义、起源、定位和价值。 中台架构的定义 中台架构是指在企业信息系统中&#xff0c;将业务流程、数据和应用系统…...

对于提高Web安全,WAF能有什么作用

数字化时代&#xff0c;网络安全已经成为了一个不可忽视的重要议题。网络攻击事件频发&#xff0c;各种安全隐患层出不穷&#xff0c;如何有效地保护我们的网络空间&#xff0c;确保信息安全&#xff0c;已成为一项迫切的任务。而Web应用防火墙&#xff0c;正是守护网络安全的一…...

Go 源码之 gin 框架

Go 源码之 gin 框架 go源码之gin - Jxy 博客 一、总结 gin.New()初始化一个实例&#xff1a;gin.engine&#xff0c;该实例实现了http.Handler接口。实现了ServeHTTP方法 注册路由、注册中间件&#xff0c;调用addRoute将路由和中间件注册到 methodTree 前缀树&#xff08;节…...

BM19 寻找峰值(二分查找)

import java.util.*; public class Solution {/*** 代码中的类名、方法名、参数名已经指定&#xff0c;请勿修改&#xff0c;直接返回方法规定的值即可** * param nums int整型一维数组 * return int整型*/public int findPeakElement (int[] nums) {// write code hereint lef…...

4.数组和切片【go】

数组是具有固定数量的元素的序列,而切片是对数组的一个连续片段的引用。切片是Go中常用的数据结构 数组(Array) 数组是一个具有固定长度且元素类型相同的序列。在Go中,数组的长度是其类型的一部分,因此[5]int和[10]int是不同的数组类型。数组的长度在声明时必须指定,并…...

Abaqus周期性边界代表体单元Random Sphere RVE 3D (Mesh)插件

插件介绍 Random Sphere RVE 3D (Mesh) - AbyssFish 插件可在Abaqus生成三维具备周期性边界条件(Periodic Boundary Conditions, PBC)的随机球体骨料及骨料-水泥界面过渡区(Interfacial Transition Zone, ITZ)模型。即采用周期性代表性体积单元法(Periodic Representative Vol…...

家庭记账本(源码+文档)

家庭记账本系统&#xff08;小程序、ios、安卓都可部署&#xff09; 文件包含内容程序简要说明含有功能项目截图客户端我的界面图表明细添加账单登录页明细注册页个人资料 后台管理用户管理后台登录页分类管理 文件包含内容 1、搭建视频 2、流程图 3、开题报告 4、数据库 5、参…...

深度学习评价指标(1):目标检测的评价指标

1. 简述 在计算机视觉/深度学习领域&#xff0c;每一个方向都有属于自己的评价指标。通常在评估一个模型时&#xff0c;只需要计算出相应的评价指标&#xff0c;便可以评估算法的性能。同时&#xff0c;所谓SOTA&#xff0c;皆是基于某一评价指标进行的评估。 接下来&#xff0…...

jmeter性能压测的标准和实战中会遇到的问题

1.性能标准建议 CPU 使用率&#xff1a;不超过 70% 内存使用率&#xff1a;不超过 70% 磁盘&#xff1a;%util到达80%严重繁忙 &#xff08;os.disIO.filesystem.writeKbPS 每秒写入的千字节&#xff09; 响应时间&#xff1a;95%的响应时间不超过8000ms 事务成功率&#xff1a…...

6-82 求链式线性表的倒数第K项

给定一系列正整数,请设计一个尽可能高效的算法,查找倒数第K个位置上的数字。 输入格式: 输入首先给出一个正整数K,随后是若干非负整数,最后以一个负整数表示结尾(该负数不算在序列内,不要处理)。 输出格式: 输出倒数第K个位置上的数据。如果这个位置不存在,输出错误…...

CDH集群hive初始化元数据库失败

oracle数据库操作&#xff1a; 报错如下&#xff1a;命令 (Validate Hive Metastore schema (237)) 已失败 截图如下&#xff1a; 后台日志部分摘录&#xff1a; WARNING: Use “yarn jar” to launch YARN applications. SLF4J: Class path contains multiple SLF4J binding…...

【ESP32S3 Sense接入语音识别+MiniMax模型对话】

1. 前言 围绕ESP32S3 Sense接入语音识别MiniMax模型对话展开&#xff0c;首先串口输入“1”字符&#xff0c;随后麦克风采集2s声音数据&#xff0c;对接百度在线语音识别&#xff0c;将返回文本结果丢入MiniMax模型&#xff0c;进而返回第二次结果文本&#xff0c;实现语言对话…...

【Java初阶(七)】接口

❣博主主页: 33的博客❣ ▶文章专栏分类: Java从入门到精通◀ &#x1f69a;我的代码仓库: 33的代码仓库&#x1f69a; 目录 1.前言2.接口2.1语法规则2.2接口使用2.3接口特性2.4实现多个接口2.5接口使用实例2.6Clonable接口和深拷贝 3.Object类3.1对象比较equals方法3.2hashcod…...

Mac OS上使用matplotlib库显示中文字体

文章目录 问题描述解决步骤参考文章 问题描述 如果我们想要使用matplotlib画图的话&#xff0c;可能会出现下面的这种warning: UserWarning: Glyph 24212 (\N{CJK UNIFIED IDEOGRAPH-5E94}) missing from current font.解决步骤 解决这个问题&#xff0c;可以按照下面的做法…...

IP种子是什么?理解和应用

在网络世界中&#xff0c;IP种子是一个广泛应用于文件共享和网络下载领域的概念。它是一种特殊的标识符&#xff0c;用于识别和连接到基于对等网络&#xff08;P2P&#xff09;协议的文件共享网络中的用户或节点。本文将深入探讨IP种子的含义、作用以及其在网络中的应用。 IP地…...

车载以太网AVB交换机 gptp透明时钟 5口 全千兆 SW1500

全千兆车载以太网交换机 一、产品简要分析 5端口千兆车载以太网交换机&#xff0c;包含4个通道的1000BASE-T1接口使用罗森博格H-MTD和泰科MATEnet双接口&#xff0c;1个通道1000BASE-T标准以太网(RJ45接口)&#xff0c;可以实现车载以太网多通道交换&#xff0c;千兆和百兆车载…...

Can‘t connect to server on ‘localhost‘ (10061)

问题&#xff1a;电脑关机重启后&#xff0c;连接不上mysql了&#xff0c;报错信息如下&#xff1a;2002 - Cant connect to server on localhost (10061)解决办法&#xff1a;很大的原因是mysql服务没有启动&#xff0c;需要你重启一下mysql&#xff1a; 以管理员的身份运行cm…...

dreamweaver网站建设和维护/百度快照怎么做

SwiftUI WWDC21 新布局组件之 03 ControlGroup 内容容器 &#xff08;待完善&#xff09; ControlGroup 一个容器视图&#xff0c;以视觉上适合上下文的方式显示语义相关的控件 struct ControlGroup<Content> where Content : View适用设备 iOS 15.0 Beta macOS 12.0…...

网站建设和网站开发/seo关键词外包公司

今天的煤矿跟以前最大的区别是什么&#xff1f;答案可以有很多&#xff0c;但有一个变化非常具有代表性&#xff1a;这是一个女孩儿们开始走进煤矿、走向生产一线的时代。以前的煤矿&#xff0c;当然是有女性身影的&#xff0c;她们或许是食堂里做饭的大姐&#xff0c;在某个场…...

朋友让你做网站如何拒绝/seo优化首页

一维数组的内存分析 二维数组的内存分析 2. 3....

vx小程序怎么制作/seo职业

原标题&#xff1a;win10玩魔兽世界启动失败怎么办&#xff1f;请看过来最近小编在windows10正式版系统启动魔兽世界7.0经典游戏时&#xff0c;能正常输入账号登录战网客户端&#xff0c;也能进入游戏&#xff0c;选择完角色进场景全部loading后&#xff0c;出现所在城镇的图像…...

怎样做金融理财网站/网站宣传

本文同步自我的博客 Reeoos Blog&#xff0c;欢迎移步前往&#xff0c;^_^ 概览 本文基于React Router v1.03版本。React Router是一个为React设计的强大的路由库。可以帮助我们快速的实现路由功能&#xff0c;包括URL和React components之间的同步映射关系。在解释React Route…...

招商网站建设服务商/seoul怎么读

PythonJS 详细介绍PythonJS 是一个用 Python 写的转换器&#xff0c;用来将 Python 代码转成快速的 JavaScript&#xff0c;可运行于 Node.js 平台上。PythonJS 的设计思路的快速和易于集成现有的 JavaScript 代码。 使用方法&#xff1a; var pythonjs require(python-js); v…...