阅读 970

📒十分钟快速入门Yarn包管理工具

前言

相信大部分刚入门前端的同学会习惯于使用npm,或者cnpm作为我们项目的包管理工具,上个月我也仍在用npm,但是它们给我们的日常开发带来便利的同时,也会伴随着一些问题,比如:安装慢、无法保持包的一致性等让开发者头疼的问题,于是作为npm的直接竞争对手Yarn出现了,这篇文章将从Yarn是什么,它有哪些优点以及如何使用等方面向大家介绍Yarn。

一、Yarn的前世今生

包管理工具是什么?

在多年前的前端项目中,前端工程师们开始使用jQuery等经典的第三方JS工具库,这大大地提高了我们前端项目的开发速度,当时前端工程师们使用它的方法一般为,在官网上下载相关版本的JS静态文件,然后放在我们自己的项目中,或者使用CDN引入等方式。

但是这种开发方式也带来了一些问题:

  • 如果我们引用的a.js,它同时依赖于b.jsc.js,那我们在下载a.js的同时,也要下载b.jsc.js文件,并且在文件里它们的引用顺序也有讲究,如果顺序不对,就会出现各种问题。
  • 第三方JS工具库会经常更新迭代,作为开发者的我们,就要经常关注第三方库的动态,如果有更新,就需要将文件重新下载下来,替换原来项目中的文件。

这些问题被发现后,一批具有开拓精神的程序员提出了新的想法和思路,于是就出现了npm包管理工具,彻底终结了以上的问题。

npm简介

npm是Node.js官方提供的,它的出现同时也制定了一些包管理规范:

  • 所有的第三方依赖包都放在node_modules这个文件目录下,我们在增加,删除,升级依赖也只是更新这个文件下的相关依赖包。
  • package.json文件中存放本项目及项目的依赖和版本信息,这样我们就可以知道本项目用到什么,都是什么版本,不用多处寻找,如下图所示:

image.png

有了npm的加持,JavaScript也就从一门不被看好的弱类型语言,发展到现在可以胜任大型前端项目的开发,稳定了前后端分离的发展思路。但是npm安装包会有安装速度问题以及版本问题,接下来我们就来认识一下Yarn,它就是用来解决这些问题的。

二、Yarn的介绍

yarn是Facebook发布的作为项目的包管理工具,快速、安全、可靠。

  • 速度快Yarn缓存了每个下载过的包,再次使用时无需重复下载。同时它是并行的,因此安装速度更快。
  • 安全:在执行代码之前,Yarn会通过算法校验每个安装包的完整性。
  • 可靠:使用详细简洁的锁文件格式和明确的安装算法,使Yarn能够在不同系统上保证无差异的工作

Yarn对比npm

  • 对比npm安装依赖的速度,yarn可以说是完全碾压
  • 关于错误提示,yarn做的更加人性化,使用npm,如果安装依赖时发生错误,npm会继续打印之后的安装日志,开发者很难注意到到底哪里安装报错

Yarn和npm能否同时使用

可以同时使用的,yarn对npm进行了安装和提升,实现了npm大部分的命令和功能,两者都遵循package.json文件,所以不用担心兼容性问题,例如我们可以使用yarn安装或删除依赖,使用npm运行启动命令,打包命令等。

Yarn的安装

这里推荐大家用下面的安装方式:

npm i yarn -g
复制代码

三、Yarn命令

上文我们已经初始了Yarn,这里将列举并解释Yarn在日常开发中的常见命令。

Yarn常见命令汇总

命令解释
yarn create创建Yarn工程
yarn init初始化工程并创建package.json文件
yarn add添加依赖
yarn install用于安装项目的所有依赖项
yarn list列出已安装的依赖
yarn outdated列出所有依赖项的版本信息
yarn owner展示依赖作者
yarn autoclean从程序包依赖项中清除并删除不必要的文件
yarn bin显示依赖bin文件夹的位置
yarn versions展示所有依赖项版本信息
yarn upgrade将指定依赖升级为最新版本
yarn cache用来管理用户缓存的依赖
yarn config用来管理依赖的配置信息
yarn info查看某一个依赖的信息,可以是没有安装过的依赖
yarn depute删除重复的依赖
yarn remove删除依赖
yarn why帮你寻找本项目的依赖

最后

⚽相信大家已经感受到了yarn的优势,希望在日常开发中,大家有机会可以多尝试多总结,另外其它主流的包管理工具还有Brower,cnpm,pnpm,这里就在不再做介绍,感兴趣的同学可以自行查阅资料了解一下~
⚾如果你对这篇文章感兴趣欢迎点赞关注+收藏,更多精彩知识正在等你!😘
🏀GitHub 博客地址: github.com/Awu1227
🏉笔者还有其他专栏,欢迎阅读~
🏐玩转CSS之美
🎱Vue从放弃到入门
🎳深入浅出JavaScript

文章分类
开发工具
文章标签