从零开始,揭秘npm install的黑科技!

880 阅读4分钟

cover.png

作为一名前端开发人员,每天我们都要使用到许多的第三方包。而通过npm package manager来安装和管理这些包是我们最为常见的方式之一。但是,你是否知道当我们使用npm install安装一个包时,发生了哪些事情呢?接下来,本文将从浅入深地剖析npm install的执行过程。

浅谈npm install

什么是npm

npm,即Node.js Package Manager,是一个用于 Node.js 的包管理器。通过该软件包管理器,开发者可以下载别人编写的代码包以及发布自己编写的代码包,并在项目中引用和使用这些包。

npm包是什么

npm包实际上就是可以被复用的Node.js模块。这些模块可以是由其他开发者创建的,也可以是我们自己个人创建并且上传到npm上的。

npm install是做什么的

通过npm install,我们可以将一个或多个npm包安装到当前项目中。这样,在项目中就可以直接使用这些包,而不必担心依赖关系等问题。

npm install的内部执行过程

话不多说,现在让我们一起来看看npm install的内部执行过程吧。

第一步:读取package.json文件

首先,npm会读取当前项目中的package.json文件,该文件含有了所有相关的依赖和开发者信息。在package.json文件中,可以指定使用哪个版本的某个包。

第二步:创建node_modules文件夹

接下来,在package.json所在的目录下,npm会自动创建一个名为node_modules的文件夹。

第三步:下载依赖项

当以上两个步骤完成后,npm就开始执行真正的安装操作了。这时,它会根据package.json中定义的依赖信息,从npm registry上下载所有依赖项,并将它们放置到node_modules目录下。

值得注意的是,如果项目中的依赖项已经存在于本地缓存中,则npm会直接从本地缓存中拷贝这些依赖对象,而不是重新从registry上下载。这样做的好处是可以提高安装速度,同时避免重复下载相同版本的依赖包。

例如,我们使用以下命令来安装jQuery:

$ npm install jquery --save-dev

那么,npm就会检查package.json文件中所列出的依赖项,并将jQuery 3.4.1版本下载并安装到本地的node_modules/jquery目录下。

第四步:解决依赖项

通过上述步骤,我们成功下载并安装了我们使用到的依赖包。不过,我们的项目中还可能存在其他依赖项,这些依赖项也需要被安装到node_modules目录下。

具体来说,当npm发现项目中某个包依赖于另一个包时,它会检查该依赖包是否已经在本地缓存中。如果是,则会将该依赖项拷贝到该包的node_modules目录下;如果不是,则从npm registry上下载该包,并将其安装到本地缓存里。

例如,当前项目中使用了lodashunderscore.string两个包。其中,在package.json中,lodash是直接被定义为项目的一个依赖,而underscore.string是被定义为lodash的一个依赖。那么,在执行npm install时,会按以下顺序进行依赖项的解决:

  1. 首先,npm会安装lodash包,并将其拷贝到node_modules/lodash中。
  2. 接着,当npm看到在package.json文件中定义了underscore.string的依赖项时,它会检查lodash是否已经被安装。此时,由于lodash已经被安装在了node_modules/lodash目录下,因此npm会继续安装并将underscore.string打包到node_modules/lodash/node_modules/underscore.string路径下。

第五步:执行preinstall脚本

在所有的依赖项被成功安装后,npm可能会在默认情况下运行预安装钩子(preinstall hook)脚本,以确保所有依赖关系都已经被正确地安装。

如果有任何错误发生,npm将会在这个阶段抛出异常,并停止执行npm install命令。

第六步:执行postinstall脚本

当所有依赖关系已经被处理完毕后,npm可根据需要运行一个或多个后安装钩子(postinstall hook)脚本,以执行任何定制化的项目初始化、配置或是构建任务等操作。

第七步:生成Lockfile

最后,npm会在项目根目录下生成一个package-lock.json文件,该文件用于锁定该项目中所有依赖项的版本号。该文件可以帮助其他开发者在不同的主机或环境中重新创建和复制该项目时,确保使用的依赖项版本与原本一致。

总结

事实上,npm install过程中涉及的步骤还有很多。但是,在掌握了基本的执行流程后,我们至少能对整个npm包安装过程有一个较为清晰的认识,方便我们针对具体场景进行问题的分析和解决。

npm深层次的工作原理远远超出于我们所期望的那么复杂。不过,通过以上的讲解,相信大家都已经对npm包管理器有了一个初步的认识了。

最后附上小提示:熟记一些基本的npm命令可以帮助你更加高效地进行代码开发,提高你的工作效率。同学们,一起加油吧!