前端包管理器的简介,pnpm的使用以及和npm的区别

news2024/11/28 6:29:35

随着前端的不断发展,包管理工具也不断的丰富,从最开始的npm到现在cnpm,pnpm,yarn,一个新的包管理工具的出现是为了弥补之前包管理工具的一个痛点,今天我就来说一下包管理器的出现的原因和pnpm的简单使用和一些包管理工具的一些区别。

cnpm

cnpm的诞生是因为我们在使用npm下载第三方库的时候,由于是外网的原因,有时候下载比较慢,而cnpm是的镜像仓库是国内的淘宝镜像,这样就让我们下载的比较快了。当然也可以执行以下命令来把npm的镜像仓库变成国内的淘宝镜像

npm config set registry http://registry.npm.taobao.org

yarn

yarn是由Facebook、Goole、Exponent和Tilde联合推出的一个新的包管理工具。它的诞生是为了弥补早期npm的一些问题的,
早期的npm存在很多缺陷,比如安装依赖速度慢,版本依赖混乱等,虽然npm从5版本只会有了很多的升级和改进,但是使用yarn的人仍有很多。

pnpm

pnpm的出现是为了弥补上述一些包管理工具的痛点,在我们平常学习的过程中,我们会新建很多的demo,比如说我们现在有1000个项目demo,每个项目中都依赖了webpack这个第三方库,而使用上述的包管理器,会使我们每个项目中的node_modules文件夹中都有一个webpack第三方依赖库相同依赖包的副本,这就导致了一些空间的浪费,可能每个项目都依赖同一个版本的第三方依赖库,而我们这1000个项目demo用一份就可以了。
pnpm的出现就解决了这个问题。它是把所有的依赖包存放到一个统一的位置
在使用pnpm安装第三方库的时候会经过以下几个步骤
1. 如果未安装,就安装
2. 如果安装过,但是版本不同也会安装
3. 之前安装过并且版本也相同会建立一个硬链接链接到保存的第三方库的位置
这里我说了一个硬链接,那么什么是硬链接呢,与之对应的是软连接,软连接就相当于我们的快捷方式,其保存着找到该文件的路径,硬链接相当于下边的这副图
在这里插入图片描述
同时pnpm采用的是非扁平化目录结构,要理解非扁平化,就要理解什么是扁平化。
我们在下载第三方库的时候,一般的第三方库一会依赖其他的第三方库,以axios为例:
在这里插入图片描述

这个是axios所依赖的第三方库的部分截图
在这里插入图片描述
不过在axios中我们并没有看到该文件夹下的node_module目录,那么axios所依赖的第三方库都安装到哪里了
在这里插入图片描述
我们在axios同级的node_modules中找到,而且我并没有按照这个第三方库。npm采用的包管理结构就说扁平化,与之对应的就是非扁平化。就是我们所安装的第三方库所依赖的第三方库会在该依赖库中的node_modules中保存,以这个例子为例,axios存放的位置是node_modules目录中,axios所依赖的第三方库会存放在axios下的node_modules中(这里需要强调一点,其存放是文件的强链接而不是第三方库的文件副本)

pnpm使用
  1. 安装
npm i pnpm -g
  1. 常用命令
    使用package.json安装项目的所有依赖
pnpm i

安装第三方库

pnpm add <包名>

卸载

pnpm remve <包名>

查看安装包统一存放的位置

pnpm store path

删除从来未被引用的包

pnpm store prune

总结

前端的包管理工具也比较多,每一个的出现都是为了解决原本问题的痛点,这次博客更多的是介绍pnpm,主要因为其与其他几个包管理器的不同,也有几个新概念。所以就来着重的介绍一下。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/576941.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【Vue】二:Vue核心处理---事件处理

文章目录 1. 事件修饰符1.1 prevent1.2 stop1.3 capture - 添加事件侦听器时使用 capture 模式。1.4 self1.5 one1.6 passive 2.按键修饰符3.系统修饰符 1. 事件修饰符 1.1 prevent 当我们点击后&#xff0c;回去先执行关联的事件&#xff0c;然后再去执行默认行为&#xff0c…

Arduino学习

物联网学习资料 《arduino程序设计基础》陈吕洲 北京航空航天大学出版社 半颗心脏博客导航一站式搜索(所有博客的汇总帖) Ai-Thinker 安信可科技 github 半颗心脏 | 徐宏 蓝牙技术 蓝牙网关【【智能家居】入门攻略二&#xff01;啥是网关&#xff1f;蓝牙、zigbee协议详…

隐藏在背后的真相——数据存储的方式(上)

数据存储的方式 1. 数据类型详细介绍1.1类型的基本归 2. 整形在内存中的存储2.1原码&#xff0c;反码&#xff0c;补码2.2有符号&#xff08;unsigned&#xff09;和无符号&#xff08;signed&#xff09;2.3 例题 3. 大小端字节序介绍及判断 所属专栏&#xff1a;C语言❤️ &a…

学网络安全可以参考什么方向?该怎么学?

在这个圈子技术门类中&#xff0c;工作岗位主要有以下三个方向&#xff1a; 安全研发安全研究&#xff1a;二进制 方向安全研究&#xff1a;网络渗透方向 下面逐一说明一下。 安全研发 安全行业的研发岗主要有两种分类&#xff1a; 与安全业务关系不大的研发岗位与安全业务…

英文论文(sci)解读复现【NO.13】基于YOLOv5的自然场景下苹果叶片病害实时检测

此前出了目标检测算法改进专栏&#xff0c;但是对于应用于什么场景&#xff0c;需要什么改进方法对应与自己的应用场景有效果&#xff0c;并且多少改进点能发什么水平的文章&#xff0c;为解决大家的困惑&#xff0c;此系列文章旨在给大家解读发表高水平学术期刊中的 SCI论文&a…

python 真正的密码,字符串排序

代码&#xff1a; from typing import List def turePassword(wordList:List[str]) ->str:wordList list(set(wordList))#排序先字符串长度&#xff0c;其次字典序wordList.sort(keylambda x :(len(x),x))ans for i in range(len(wordList)-1,-1,-1):flag Truefor j in …

蓝奥声核心技术分享——无线同步群控技术

1.技术背景 无线同步群控技术指基于对目标场景状态变化的协同感知而获得触发响应并进行智能决策&#xff0c;属于蓝奥声核心技术--边缘协同感知(EICS&#xff09;技术的关键支撑性技术之一。该项技术涉及无线物联网边缘域网络的无线通信与智能控制技术领域&#xff0c;具体主要…

浅谈人工智能怎么提升工作效率

一、引言 随着科技的飞速发展&#xff0c;人工智能&#xff08;AI&#xff09;逐渐成为各行各业提高工作效率的重要工具。本报告旨在通过分析人工智能在提高工作效率方面的作用&#xff0c;探讨其具体实现方法&#xff0c;并通过案例分析来深入了解其实际应用效果和优缺点&…

算法8.从暴力递归到动态规划1

算法|8.从暴力递归到动态规划1 目前感觉&#xff0c;背包问题和货币数组问题本质相同&#xff0c;货币的与dp相关的三种代码写完了&#xff0c;快复习不完了&#xff0c;背包暂时先不写了&#xff0c;回头再写&#xff0c;补充&#xff0c;再总结&#xff0c;结合那个C大神的文…

对KMP算法的一点碎碎念——上篇

对KMP算法的一点碎碎念——上篇 文章目录 对KMP算法的一点碎碎念——上篇1. KMP 算法 Next数组 求解问题1.1 前置知识-最长公共前后缀LCP1.1.1 前缀与后缀1.1.2 最长公共前后缀LCP 1.2 手算法求解 Next数组值(3种常见情况)1.2.1 情况1: next数组 正常存放匹配字符的长度情况1的…

前端面试-React专题

目录 一.React1. React 的主要特性是什么2.React 的核心思想是3. 什么是jsx4. render()函数5. 函数组件和类组件的区别6. HTML和React中事件处理的区别7. React 中的合成事件8. 虚拟Dom&#xff1f;为什么使用&#xff1f;如何实现&#xff1f;9. 在 constructor 中给 super 函…

Excel - 如何给单元格加上下拉框

当你使用下拉列表来限制人们在单元格中的输入时&#xff0c;数据输入会更快、更准确。当有人选择一个单元格时&#xff0c;下拉列表的向下箭头就会出现&#xff0c;可以点击它并进行选择。 创建一个下拉列表 / Create a drop-down list 你可以通过提供下拉列表使工作表更有效率…

基于微信小程序的教学质量评价系统

末尾获取源码 开发语言&#xff1a;Java Java开发工具&#xff1a;JDK1.8 后端框架&#xff1a;SSM 前端&#xff1a;Vue 数据库&#xff1a;MySQL5.7和Navicat管理工具结合 服务器&#xff1a;Tomcat8.5 开发软件&#xff1a;IDEA / Eclipse 是否Maven项目&#xff1a;是 目录…

ubuntu下编译esp32 micropython固件编译(可自行增加模块)

目录 0. 前言1. 安装ESP-IDF2. 初始化Micropython仓库3. 选择ESP-IDF相应版本情况&#xff11;情况2 4. 开始编译5.烧录固件 0. 前言 为ESP32编译Micropython固件 操作系统&#xff1a;ubuntu22.04 1. 安装ESP-IDF 本节需要ESP-IDF环境&#xff0c;安装开发环境是必要的。 …

FPGA之手把手教你做多路信号发生器(STM32与FPGA数据互传控制波形生成)

文章目录 博主的念叨一、任务介绍1、本文目标2、设计思路3、设计注意事项 二、设计代码1.顶层文件代码2.波形生成模块3.ROM例化4.PLL例化5.引脚分配 总结 博主的念叨 博主建了一个技术资源分享的群&#xff0c;开源免费&#xff0c;欢迎进来唠嗑280730348 最近趁热打铁做了一…

pandas库的常用操作介绍

目录 1.1.Pandas概述2.Pandas索引结构3.groupby学习5.Pandas数值运算二元统计6.对象操作7.merge合并显示设置9.pivot操作10. 时间操作11.常用操作12.groupby操作13.字符串操作14.索引操作15.pandas绘图操作 1.1.Pandas概述 Python的pandas库是一个数据处理和数据分析库&#x…

javascript基础七:说说你对Javascript中作用域的理解?

一、作用域 作用域&#xff0c;即变量&#xff08;变量作用域又称上下文&#xff09;和函数生效&#xff08;能被访问&#xff09;的区域或集合 换句话说&#xff0c;作用域决定了代码区块中变量和其他资源的可见性 举个粟子 function myFunction(){let name小爱同学 } undef…

6.2:荷兰国旗问题

文章目录 实现key前面的数都小于等key&#xff0c;key后面的数都大于等于key1&#xff1a;前后指针法&#xff1a;2&#xff1a;挖坑法3&#xff1a;单指针法&#xff08;左神&#xff09; 辗转相除法求最大公约数 实现key前面的数都小于等key&#xff0c;key后面的数都大于等于…

【leetCode:剑指 Offer】20. 表示数值的字符串

1.题目描述 请实现一个函数用来判断字符串是否表示数值&#xff08;包括整数和小数&#xff09;。 数值&#xff08;按顺序&#xff09;可以分成以下几个部分&#xff1a; 若干空格 一个 小数 或者 整数 &#xff08;可选&#xff09;一个 e 或 E &#xff0c;后面跟着一个 …

深入篇【C++】类与对象:详解内部类+匿名对象+编译器对拷贝的优化

这里写目录标题 Ⅰ.内部类【特点】1.天生友元2.直接访问static成员3.访问限制符限制4.外部类的大小 Ⅱ.匿名对象【特点】1.一行生命域2.对象具有常性3.可强行续命 Ⅲ.拷贝对象时编译器的优化 Ⅰ.内部类 概念&#xff1a;一个类定义在另一个类内部&#xff0c;这个内部的类就叫做…