JavaScript 包管理器工作原理简介

简介: 本文讲的是JavaScript 包管理器工作原理简介,这是个对的选择,因为 JavaScript 管理器这个大组织中出现了一个新成员,叫做 Yarn,刚刚出现,就引发了很多讨论。
本文讲的是JavaScript 包管理器工作原理简介,

不久前,Node.js 社区的负责人之一 ashley williams 发了一条这样的推特:

lockfiles = awesome for apps, bad for libs this is not a new thought, i'm confused why's everyone mad about this 锁文件 = 棒(对于应用而言),坏(对于库而言),这不是一个新想法,我只是很困惑,为什么所有的人都因为这个很崩溃

— @ag_dubs

我不是很懂她说的是什么,所以我决定去深入钻研下,学习一些包管理器的工作机制。

这是个对的选择,因为 JavaScript 管理器这个大组织中出现了一个新成员,叫做 Yarn,刚刚出现,就引发了很多讨论。

所以我利用这个机会,也来理解一下 Yarn 是怎样和 npm 区分开来的,为什么要这样

我在研究这个的时候觉得很有意思,真希望很久以前就这么做了。所以我写了篇关于 npm 和 Yarn 的简单介绍,来分享我学到的一些东西。

让我们从一些定义开始:

什么是包?

包是一段可以复用的代码,这段代码可以从全局注册表下载到开发者的本地环境。每个包可能会,也可能不会依赖于别的包。

什么是包管理器?

简单地说,包管理器是一段代码,它可以让你管理依赖(你或者他人写的外部代码),你的项目需要这些依赖来正确运行。

很多包管理器在处理你项目的以下部分:

项目代码

项目代码即你的项目中的代码,你需要为它管理不同的依赖。通常来说,所有的代码都被放入像 Git 这样的版本控制系统里。

Manifest 资源配置文件(Manifest file)

Manifest 资源配置文件指的是记录你的所有依赖(需要管理的包)的文件。它也保存了你项目的元数据(metadata)。在 JavaScript 的世界中,这个文件就是你的 [package.json](https://docs.npmjs.com/files/package.json)

依赖代码

依赖代码指组成你的依赖的代码。在应用的生命周期里,这段代码不应被更改,在它被需要的时候,也应该能被在内存里的项目代码所访问。

锁文件(Lock file)

锁文件是由包管理器自动生成的。它包含了重现全部的依赖源码树需要的所有信息、你的项目依赖中的所有信息,以及它们各自的版本。

现在值得强调的是,Yarn 使用了锁文件,而 npm 没有。我们会谈到这种差别导致的一些后果。

既然我已经向你介绍了包管理器这部分,现在我们来讨论依赖本身。

扁平依赖(Flat Dependencies)VS 嵌套依赖(Nested Dependencies)

为了理解扁平依赖和嵌套依赖的区别,让我们试着可视化你项目中的依赖树。

记住,你项目中的依赖也可能依赖于它自己。这些依赖也可能会相应地有一些共同的依赖。

为了让这个更清楚,我们表达为,我们的应用依赖于依赖 A、B 和 C,C 依赖于 A。

扁平依赖

扁平关系下的依赖关系图

正如图中展示的,应用(app)和 C 将 A 作为它们的依赖。为了在扁平依赖场景中解析依赖,你的包管理器只需要遍历一层依赖。

长的故事变短了——你只能拥有你的源码树里的特定包的一个版本,因为对于你的所有依赖,有一个公共的命名空间。

假设包 A 升级到版本 2.0,如果你的 app 与版本 2.0 兼容,但是包 C 不与其兼容的话,我们需要两个版本的包 A,用来让你的 app 正常工作。这就是传说中的 依赖地狱(Dependency Hell)

嵌套依赖

嵌套关系下的依赖关系图

曾经简单的处理依赖地狱的方法是有两个不同版本的包 A - 版本 1.0 和版本 2.0。

这个时候,自然需要嵌套依赖出场。在嵌套依赖的情况下,所有的依赖可以将它自身的依赖从其它依赖中独立出来,独立到另一个命名空间里。

为了解析依赖,包管理器需要遍历多层。

我们可以在这样的场景下拥有多份单个依赖的副本。

但是就像你可能已经猜到的那样,这个也会导致一些问题。如果我们将另一个包——也就是包 D——加入依赖,它也同样依赖于包 A 的版本 1.0 呢?

所以在这种场景下,我们可以用包 A 的版本 1.0 的重复来结束。这可能会导致一些混乱,并且占用一些不必要的磁盘空间。

一种解决以上问题的方法是拥有包 A 的两个版本,v1.0 和 v2.0,但只有一份 v1.0 的副本,这样我们就可以避免不必要的重复。这就是 npm v3 中采取的做法,相当多地减少了遍历依赖树消耗的时间。

就像 ashley williams 阐述的那样,npm v2 用一种嵌套的方式来安装依赖。这就是 npm v3 相较而言快多了的原因。

确定性 VS. 不确定性

在包管理器里另一个重要概念是确定性。在 JavaScript 生态系统的大背景下,确定性意味着所有拥有同一个 package.json 文件的电脑都将在它们的 node_modules 文件夹里有一个完全相同的依赖源码树。

但是如果是一个具有不确定性的包管理器,那么就不能保证了。即使你在两台电脑上有一个完全一样的 package.json ,它们的 node_modules 也可能不一样。

确定性总是被喜爱的,它能够帮助你避免 「工作在自己的机器上,但是当部署的时候总会坏掉」 的问题,这种问题可能发生在不同电脑上有不同的 node_modules 时。

最新潮的开发人员也会遇到不确定性的问题。

npm v3 默认的是不确定的安装,但它提供了一个 shrinkwrap 特性 来让安装变得有确定性的。这将所有在磁盘上的包以及它们各自的版本,写入一个锁文件。

Yarn 提供了具有确定性的安装,因为它使用了一个锁文件,在应用层递归地锁住所有的依赖。所以如果包 A 依赖于 包 C 的 v1.0,包 B 依赖于包 A 的 v2.0,这两个依赖都会被分别写入锁文件。

当你知道你工作时使用的依赖的确切版本,你可以轻松地重现构建,然后追踪并且隔离 bug。

为了使得它更清晰,你的 package.json 表达的是在项目中**「我想要的」,而你的锁文件表达的是依赖中「我有的」**。— Dan Abramov

所以我们可以回到最初的问题,也就是使得我开始这段探索之路的问题:为什么对于应用,锁文件是一个好的实践,但是对于库来说,不是呢?

最主要的原因是你实际上要部署应用。所以你需要拥有具有确定性的依赖,从而在不同的环境中重现你的构建——测试、前进和生产。

但是对于库来说就不一样啦,库不是被部署的,它们是用来构建其它库,或者在自身的应用中使用的。库需要很灵活,所以它们可以最大化兼容性。

如果我们对于所有我们在应用中用到的依赖(库)都有个锁文件(lockfile),并且应用被强制遵循锁文件,将没有办法使得所有的地方靠近我们之前提到的扁平依赖结构,和 语义化版本(semantic versioning) 灵活性,这种灵活性是依赖解析最好的用例场景。

这就是原因:如果你的应用需要递归地遵守你的所有依赖的锁文件,所有的地方都将会有版本冲突——即使在相对小的项目中。由于 语义化版本(semantic versioning),这将导致大规模无法避免的重复。

这并不是说库不能拥有锁文件,它们当然可以。但是主要的重点是像 Yarn 和 npm 这样的包管理器,它们也是这些库的使用者,并且会无视它们的锁文件。





原文发布时间为:2016年10月21日

本文来自云栖社区合作伙伴掘金,了解相关信息可以关注掘金网站。
目录
打赏
0
0
0
0
26199
分享
相关文章
在NodeJS中使用npm包进行JS代码的混淆加密
总的来说,使用“javascript-obfuscator”包可以帮助我们在Node.js中轻松地混淆JavaScript代码。通过合理的配置,我们可以使混淆后的代码更难以理解,从而提高代码的保密性。
58 9
深入理解 JavaScript 中的 Array.find() 方法:原理、性能优势与实用案例详解
Array.find() 是 JavaScript 数组方法中一个非常实用和强大的工具。它不仅提供了简洁的查找操作,还具有性能上的独特优势:返回的引用能够直接影响原数组的数据内容,使得数据更新更加高效。通过各种场景的展示,我们可以看到 Array.find() 在更新、条件查找和嵌套结构查找等场景中的广泛应用。 在实际开发中,掌握 Array.find() 的特性和使用技巧,可以让代码更加简洁高效,特别是在需要直接修改原数据内容的情形。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一
MutationObserver详解+案例——深入理解 JavaScript 中的 MutationObserver:原理与实战案例
MutationObserver 是一个非常强大的 API,提供了一种高效、灵活的方式来监听和响应 DOM 变化。它解决了传统 DOM 事件监听器的诸多局限性,通过异步、批量的方式处理 DOM 变化,大大提高了性能和效率。在实际开发中,合理使用 MutationObserver 可以帮助我们更好地控制 DOM 操作,提高代码的健壮性和可维护性。 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一下,还可以收藏起来以备不时之需,有疑问和错误欢迎在评论区指出~
MutationObserver详解+案例——深入理解 JavaScript 中的 MutationObserver:原理与实战案例
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
1136 1
深入理解JavaScript中的闭包:原理与实战
【10月更文挑战第12天】深入理解JavaScript中的闭包:原理与实战
详解js柯里化原理及用法,探究柯里化在Redux Selector 的场景模拟、构建复杂的数据流管道、优化深度嵌套函数中的精妙应用
柯里化是一种强大的函数式编程技术,它通过将函数分解为单参数形式,实现了灵活性与可复用性的统一。无论是参数复用、延迟执行,还是函数组合,柯里化都为现代编程提供了极大的便利。 从 Redux 的选择器优化到复杂的数据流处理,再到深度嵌套的函数优化,柯里化在实际开发中展现出了非凡的价值。如果你希望编写更简洁、更优雅的代码,柯里化无疑是一个值得深入学习和实践的工具。从简单的实现到复杂的应用,希望这篇博客能为你揭开柯里化的奥秘,助力你的开发之旅! 只有锻炼思维才能可持续地解决问题,只有思维才是真正值得学习和分享的核心要素。如果这篇博客能给您带来一点帮助,麻烦您点个赞支持一
Node.js新作《循序渐进Node.js企业级开发实践》简介
《循序渐进Node.js企业级开发实践》由清华大学出版社出版,基于Node.js 22.3.0编写,包含26个实战案例和43个上机练习,旨在帮助读者从基础到进阶全面掌握Node.js技术,适用于初学者、进阶开发者及全栈工程师。
103 9
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
Vue.js响应式原理深度解析:从Vue 2到Vue 3的演进
171 17
JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式
本文深入解析了JavaScript前端路由的实现原理及其在单页应用中的重要性,涵盖前端路由概念、基本原理、常见实现方式(Hash路由和History路由)、优点及挑战,并通过实际案例分析,帮助开发者更好地理解和应用这一关键技术,提升用户体验。
196 1
深度剖析 Vue.js 响应式原理:从数据劫持到视图更新的全流程详解
本文深入解析Vue.js的响应式机制,从数据劫持到视图更新的全过程,详细讲解了其实现原理和运作流程。
AI助理

你好,我是AI助理

可以解答问题、推荐解决方案等