红宝书第三十一讲:通俗易懂的包管理器指南:npm 与 Yarn

news2025/4/18 23:56:41

红宝书第三十一讲:通俗易懂的包管理器指南:npm 与 Yarn

资料取自《JavaScript高级程序设计(第5版)》。
查看总目录:红宝书学习大纲


一、基础概念

包管理器:帮你自动下载和管理第三方代码库(如React、Lodash)的工具 1
核心作用:

  1. 安装依赖:从公共仓库获取代码包
  2. 版本管理:明确指定项目依赖的版本
  3. 脚本自动化:快速执行构建/测试任务

二、npm(Node Package Manager)

Node.js 官方默认工具,适合中小型项目 12

1. 基础使用步骤

常用命令

# 初始化项目(生成 package.json)
npm init -y 

# 安装生产依赖(会记录在 dependencies)
npm install lodash

# 安装开发依赖(记录在 devDependencies)
npm install eslint --save-dev
2. 依赖管理特点

使用 嵌套树结构(每个子依赖独立装自己的版本)2
举例:你的项目依赖A和B,而A依赖D@1.0,B依赖D@2.0
→ 生成 node_modules 结构:

node_modules/
├── A/
│   └── node_modules/
│       └── D@1.0/
└── B/
    └── node_modules/
        └── D@2.0/

三、Yarn(由 Facebook 开发)

专注于 更快的安装速度和安全改进,适合大型项目 3

1. 核心优化
  • 离线缓存:重复安装直接读取本地缓存 3
  • 锁定版本:生成 yarn.lock 文件严格锁定依赖版本
  • 并行下载:比npm更快下载包

安装方式

# 全局安装Yarn(需先安装Node.js)
npm install -g yarn

# 初始化项目(生成 package.json)
yarn init -y

# 安装包
yarn add axios
2. 依赖结构扁平化

相同示例(依赖A和B,A需要D@1.0,B需要D@2.0)
→ 尝试共享依赖但可能冲突时分开:

node_modules/
├── A/
├── B/
├── D@1.0/  # 为A安装的版本
└── D@2.0/  # 为B安装的版本

四、如何选择?
维度npmYarn
安装速度较慢快(并行下载 + 缓存)3
版本锁定package-lock.json(自动)yarn.lock(更严格)3
适用场景小型项目/简单脚本大型项目/团队协作

五、实战示例
场景:创建一个使用Lodash的项目

使用npm

# 1. 初始化项目
npm init -y

# 2. 安装Lodash
npm install lodash

# 3. 在代码中使用
// index.js
const _ = require('lodash');
console.log(_.sum([1, 2, 3]));  // 输出:6

使用Yarn

# 1. 初始化项目(需全局安装Yarn)
yarn init -y

# 2. 安装Lodash
yarn add lodash

# 3. 运行脚本
node index.js

目录:总目录
上篇文章:红宝书第三十讲:通俗易懂的JavaScript调试指南
下篇文章:红宝书第三十二讲:零基础学会模块打包器:Webpack、Parcel、Rollup

脚注


  1. 《JavaScript高级程序设计(第5版)》说明npm是Node.js的默认包管理器 ↩︎ ↩︎

  2. 《JavaScript高级程序设计(第5版)》描述npm使用嵌套依赖树安装包 ↩︎ ↩︎

  3. 《JavaScript高级程序设计(第5版)》指出Yarn具备缓存和严格的版本锁定 ↩︎ ↩︎ ↩︎ ↩︎

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

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

相关文章

进程状态的转换

进程处于运行态时,它必须已获得所需的资源,在运行结束后就撤销。只有在时间片到或出现了比现在进程优先级更高的进程时才转变成就绪态。 就绪 → 运行​​ ​​触发条件​​:进程被​​调度器选中​​(如时间片轮转或优先级调度&…

SpringAOP新链浅析

前言 在复现CCSSSC软件攻防赛的时候发现需要打SpringAOP链子,于是跟着前人的文章自己动手调试了一下 参考了大佬的文章 https://gsbp0.github.io/post/springaop/#%E6%B5%81%E7%A8%8B https://mp.weixin.qq.com/s/oQ1mFohc332v8U1yA7RaMQ 正文 依赖于Spring-AO…

【动手学深度学习】现代卷积神经网络:ALexNet

【动手学深度学习】现代卷积神经网络:ALexNet 1,ALexNet简介2,AlexNet和LeNet的对比3, AlexNet模型详细设计4,AlexNet采用ReLU激活函数4.1,ReLU激活函数4.2,sigmoid激活函数4.3,为什…

PyTorch深度学习框架60天进阶学习计划 - 第37天:元学习框架

PyTorch深度学习框架60天进阶学习计划 - 第37天:元学习框架 嘿,朋友们!欢迎来到我们PyTorch进阶之旅的第37天。今天我们将深入探索一个非常有趣且强大的领域——元学习(Meta-Learning),也被称为"学会学习"(Learning to…

【中检在线-注册安全分析报告】

前言 由于网站注册入口容易被黑客攻击,存在如下安全问题: 1. 暴力破解密码,造成用户信息泄露 2. 短信盗刷的安全问题,影响业务及导致用户投诉 3. 带来经济损失,尤其是后付费客户,风险巨大,造…

UE5 运行时动态将玩家手部模型设置为相机的子物体

在编辑器里,我们虽然可以手动添加相机,但是无法将网格体设置为相机的子物体,只能将相机设置为网格体的子物体 但是为了使用方便,我们希望将网格体设置为相机的子物体,这样我们直接旋转相机就可以旋转网格体&#xff0…

EasyExcel-一款好用的excel生成工具

EasyExcel是一款处理excel的工具类,主要特点如下(官方): 特点 高性能读写:FastExcel 专注于性能优化,能够高效处理大规模的 Excel 数据。相比一些传统的 Excel 处理库,它能显著降低内存占用。…

WEB攻防-Java安全JNDIRMILDAP五大不安全组件RCE执行不出网不回显

目录 1. RCE执行-5大类函数调用 1.1 Runtime方式 1.2 Groovy执行命令 1.3 脚本引擎代码注入 1.4 ProcessImpl 1.5 ProcessBuilder 2. JNDI注入(RCE)-RMI&LDAP&高版本 2.1 RMI服务中的JNDI注入场景 2.2 LDAP服务中的JNDI注入场景 攻击路径示例&#…

DrissionPage移动端自动化:从H5到原生App的跨界测试

一、移动端自动化测试的挑战与机遇 移动端测试面临多维度挑战: 设备碎片化:Android/iOS版本、屏幕分辨率差异 混合应用架构:H5页面与原生组件的深度耦合 交互复杂性:多点触控、手势操作、传感器模拟 性能监控:内存…

从 Excel 到你的表格应用:条件格式功能的嵌入实践指南

一、引言 在日常工作中,面对海量数据时,如何快速识别关键信息、发现数据趋势或异常值,是每个数据分析师面临的挑战。Excel的条件格式功能通过自动化的视觉标记,帮助用户轻松应对这一难题。 本文将详细介绍条件格式的应用场景&am…

STM32单片机入门学习——第22节: [7-2] AD单通道AD多通道

写这个文章是用来学习的,记录一下我的学习过程。希望我能一直坚持下去,我只是一个小白,只是想好好学习,我知道这会很难,但我还是想去做! 本文写于:2025.04.07 STM32开发板学习——第22节: [7-2] AD单通道&AD多通道 前言开发板说明引用解…

【Survival Analysis】【机器学习】【1】

前言: 今年在做的一个博士课题项目,主要是利用病人的数据,训练出一个AI模型,做因果分析, 以及个性化治疗。自己一直是做通讯AI方向的,这个系列主要参考卡梅隆大学的教程,以及临床医生的角度 了…

JavaScript---原型和原型链

目录 一、引用类型皆为对象 二、原型和原型链是什么 三、__proto__与prototype 总结 四、原型链顶层 五、constructor 六、函数对象的原型链 一、引用类型皆为对象 原型和原型链都是来源于对象而服务于对象: JavaScript中一切引用类型都是对象,…

离散数学问题集--问题5.9

问题 5.9 综合了计算机组成原理、数字逻辑和离散数学中的关键概念,旨在帮助学生理解二进制算术运算的硬件实现、逻辑门与算术运算的关系,以及如何使用数学方法来验证数字系统的正确性。它强调了从规范到实现再到验证的完整过程。 思想 函数抽象&#xf…

Java—HTML:CSS选择器

今天我要介绍的知识点内容是Java HTML中的CSS选择器; CSS选择器用于定位HTML元素并为其添加样式。它允许我们控制网页的颜色、字体、布局和其他视觉元素。通过分离内容与样式。 下面我将介绍CSS中选择器的使用,并作举例说明; 选择器基本语…

SSM阶段性总结

0 Pojo类 前端给后端:DTO 后端给前端:VO 数据库:PO/VO 业务处理逻辑:BO 统称pojo 1 代理模式 实现静态代理: 1定义接口2实现类3写一个静态代理类4这样在调用时就可以使用这个静态代理类来实现某些功能 实现动态代…

Qt 5.14.2入门(一)写个Hello Qt!程序

目录 参考链接:一、新建项目二、直接运行三、修改代码增加窗口内容1、Qt 显示一个 QLabel 标签控件窗口2、添加按键 参考链接: Qt5教程(一):Hello World 程序 Qt 编程指南 一、新建项目 1、新建一个项目&#xff08…

Jmeter分布式测试启动

代理客户端配置 打开jmeter.properties文件,取消注释并设置端口(如server_port1099), 并添加server.rmi.ssl.disabletrue禁用SSL加密。 (Linux系统)修改jmeter-server文件中的RMI_HOST_DEF为代理机实际IP。…

redis itheima

缓存问题 核心是如何避免大量请求到达数据库 缓存穿透 既不存在于 redis,也不存在于 mysql 的key,被重复请求 public Result queryById(Long id) {String key CACHE_SHOP_KEYid;// 1. redis & mysqlString shopJson stringRedisTemplate.opsFo…

100天精通Python(爬虫篇)——第122天:基于selenium接管已启动的浏览器(反反爬策略)

文章目录 1、问题描述2、问题推测3、解决方法3.1 selenium自动启动浏览器3.2 selenium接管已启动的浏览器3.3 区别总结 4、代码实战4.1 手动方法(手动打开浏览器输入账号密码)4.2 自动方法(.bat文件启动的浏览器) 1、问题描述 使用…