自从Node走向成熟,前端工程师引用第三方软件包的方式就发生了很大的变化。资源的下载(安装)的方式就从去资源官网下载地址下载到本地演变为使用包管理工具采用统一的方式进行下载安装,从“游击”转型为“正规”。前端技术百花齐放,包管理工具也出现了几个非常出名的:NPM、Yarn和bower。

什么是包管理工具

包管理工具它可以用于搜索、安装、卸载和更新如JavaScript、CSS、HTML这类的网络资源。使用包管理工具我们可以采用统一的方式来下载安装第三方的资源,如jQuery、Vue、Bootstrap等。因为在做BS项目的开发的时候我们都会使用到大量的第三方资源库,这些资源库如何引用和安装在过去一直没有标准的做法,大部分是将这资源库统一下载保存到本地的固定位置,这种方式造成了几个问题:每个资源库需要去寻找官网去各自官网下载(有的程序员偷懒,直接百度不去官网下载,有可能代码被篡改);资源库的更新很麻烦;这些资源未保证项目正常运行都需要纳入版本控制进行管理(而实则没有必要)。包管理工具的出现很好的解决了这些问题。

NPM、Bower、Yarn

Bower

npm是前端打包工具吗(前端包管理工具NPM)(1)

Bower是一个很早出现的工具,我也不知道为什么会出现Bower这个工具。个人感觉应该可能是当时NPM下载速度很慢而且很多第三方的库没有进入NPM统一管理,bower又支持直接从git地址进行下载,所以有效解决了当时NPM下载慢库资源不多的问题。

现如今Bower已经“英雄迟暮”,已不适用于现代的前端开发,完成了它的历史任务在当下的环境下,不再推荐使用。

Bower安装`npm install -g bower`,使用Bower安装资源库`bower install <package>`

Bower是通过自己生成的bower.json对项目使用的资源库进行配置管理的,也正是这个原因它与node的package.json不兼容导致注定了只是特定时候的一个工具,过了那段时间就将退出历史舞台。

引用Bower官方的一句话

While Bower is maintained, we recommend using Yarn and Webpack or Parcel for front-end projects

Yarn

npm是前端打包工具吗(前端包管理工具NPM)(2)

Yarn是一个快速、可靠、安全的依赖管理工具。官方的介绍

* 极其快速,Yarn 会缓存它下载的每个包,所以无需重复下载。它还能并行化操作以最大化资源利用率,安装速度之快前所未有。

* 特别安全,Yarn会在每个安装包被执行前校验其完整性。

* 超级可靠,Yarn 使用格式详尽而又简洁的 lockfile文件 和确定性算法来安装依赖,能够保证在一个系统上的运行的安装过程也会以同样的方式运行在其他系统上。

我本人在使用的时候发现,“快速”应该是它最大的优点,它能够做到从缓存安装和并行化安装。这些都是NPM没有的,而且Yarn除了这些优点外它比bower聪明的地方是它的配置文件依旧是node的package.json,它与嫡系NPM是完全兼容的。目前前端的打包、测试、检查会大量使用到package.json文件,也就意味着Yarn与这些都能够做到无缝的对接。Yarn的出现很好的解决了一些NPM的问题特别是国内官方NPM库速度很慢(如果没记错的话Yarn刚出来时,NPM甚至是没有版本锁定功能的),而它本身又能与NPM、Node兼容。所以非常多的人使用

NPM

npm是前端打包工具吗(前端包管理工具NPM)(3)

NPM是Node的亲儿子,虽然刚出来时有很多问题,当今天这一两年的发展已经解决了很多问题(当然国内访问慢这个也不是人间造成的),毕竟是嫡系使用的人应该是最多的。特别是现在大前端的兴起,很多配置都写入了package.json,开箱即用的方式使用NPM非常的方便省事。

针对国内访问官方仓库的问题,可以使用国内的镜像仓库或者cnpm,可以解决这类问题。

总结

我个人在工作中大部分时候是用NPM来进行包管理和依赖安装,有时候也会根据已有项目的具体情使用Yarn,Bower只在两年前做后端开发的时候用来做过依赖的安装目前已不再使用。

在前端开发中我个人还是比较推荐使用NPM,至于Yarn确实速度是比NPM快很多但就我个人而言影响不大。

,