npm和yarn的区别,我们该如何选择?
首先,这两个都属于js包管理工具,都可以安装包或者模块
yarn 是由facebook、google等联合开发推出的
区别:
npm 下载包的话 比如npm install
它是按照包的排序,也就是队列挨个下载,一个下载完成后,再下载另一个
yarn是将要下载的包进行同时下载
yarn 在下载模块或包时,命令行输出的信息更加简洁
npm版本5.0 之后,会自带package.lock.json 文件,该文件主要描述了你项目中安装的包都是哪一个版本,你再进行npm install 的话,会安装指定版本的包。
yarn 一直都有lock 文件,功能和npm 的package.lock.json差不多。
命令不同
npm install == yarn
npm isntall vue == yarn add vue
npm uninstall vue == yarn remove vue
npm update == yarn upgrade
按照以往,我的步骤都是:
git clone xxx
npm install
npm run dev
这时,JJ给我来了下面一段
git clone xxx
yarn
yarn start
“咦,yarn是什么鬼?难道npm更高级的替代品?为什么要替代npm?难道有什么好的地方?”,内心一连串的问题冒出来。我就默默的问了一下JJ:“yarn是跟npm一样的东西吗?”,“嗯。”JJ忙碌的敲着键盘,显然这个问题不值得继续问下去了。我也默默的把刚才脑子里一连串的问题记了下来。
Yarn是什么?
“Yarn是由Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS 包管理工具 ,正如官方文档中写的,Yarn 是为了弥补 npm 的一些缺陷而出现的。”这句话让我想起了使用npm时的坑了:
npm install
的时候巨慢。特别是新的项目拉下来要等半天,删除node_modules,重新install的时候依旧如此。- 同一个项目,安装的时候无法保持一致性。由于package.json文件中版本号的特点,下面三个版本号在安装的时候代表不同的含义。
"5.0.3",
"~5.0.3",
"^5.0.3"
“5.0.3”表示安装指定的5.0.3版本,“~5.0.3”表示安装5.0.X中最新的版本,“^5.0.3”表示安装5.X.X中最新的版本。这就麻烦了,常常会出现同一个项目,有的同事是OK的,有的同事会由于安装的版本不一致出现bug。
- 安装的时候,包会在同一时间下载和安装,中途某个时候,一个包抛出了一个错误,但是npm会继续下载和安装包。因为npm会把所有的日志输出到终端,有关错误包的错误信息就会在一大堆npm打印的警告中丢失掉,并且你甚至永远不会注意到实际发生的错误。
带着这些坑,我开始了解Yarn的优势及其解决的问题。
Yarn的优点?
- 速度快。速度快主要来自以下两个方面:
- 并行安装:无论 npm 还是 Yarn 在执行包的安装时,都会执行一系列任务。npm 是按照队列执行每个 package,也就是说必须要等到当前 package 安装完成之后,才能继续后面的安装。而 Yarn 是同步执行所有任务,提高了性能。
- 离线模式:如果之前已经安装过一个软件包,用Yarn再次安装时之间从缓存中获取,就不用像npm那样再从网络下载了。
- 安装版本统一:为了防止拉取到不同的版本,Yarn 有一个锁定文件 (lock file) 记录了被确切安装上的模块的版本号。每次只要新增了一个模块,Yarn 就会创建(或更新)yarn.lock 这个文件。这么做就保证了,每一次拉取同一个项目依赖时,使用的都是一样的模块版本。npm 其实也有办法实现处处使用相同版本的 packages,但需要开发者执行 npm shrinkwrap 命令。这个命令将会生成一个锁定文件,在执行 npm install 的时候,该锁定文件会先被读取,和 Yarn 读取 yarn.lock 文件一个道理。npm 和 Yarn 两者的不同之处在于,Yarn 默认会生成这样的锁定文件,而 npm 要通过 shrinkwrap 命令生成 npm-shrinkwrap.json 文件,只有当这个文件存在的时候,packages 版本信息才会被记录和更新。
- 更简洁的输出:npm 的输出信息比较冗长。在执行 npm install <package> 的时候,命令行里会不断地打印出所有被安装上的依赖。相比之下,Yarn 简洁太多:默认情况下,结合了 emoji直观且直接地打印出必要的信息,也提供了一些命令供开发者查询额外的安装信息。
- 多注册来源处理:所有的依赖包,不管他被不同的库间接关联引用多少次,安装这个包时,只会从一个注册来源去装,要么是 npm 要么是 bower, 防止出现混乱不一致。
- 更好的语义化: yarn改变了一些npm命令的名称,比如 yarn add/remove,感觉上比 npm 原本的 install/uninstall 要更清晰。
Yarn和npm命令对比
npm | yarn |
---|---|
npm install | yarn |
npm install react --save | yarn add react |
npm uninstall react --save | yarn remove react |
npm install react --save-dev | yarn add react --dev |
npm update --save | yarn upgrade |
npm的未来:npm5.0
有了yarn的压力之后,npm做了一些类似的改进。
- 默认新增了类似yarn.lock的 package-lock.json;
- git 依赖支持优化:这个特性在需要安装大量内部项目(例如在没有自建源的内网开发),或需要使用某些依赖的未发布版本时很有用。在这之前可能需要使用指定 commit_id 的方式来控制版本。
- 文件依赖优化:在之前的版本,如果将本地目录作为依赖来安装,将会把文件目录作为副本拷贝到 node_modules 中。而在 npm5 中,将改为使用创建 symlinks 的方式来实现(使用本地 tarball 包除外),而不再执行文件拷贝。这将会提升安装速度。目前yarn还不支持。
总结
在npm5.0之前,yarn的优势特别明显。但是在npm之后,通过以上一系列对比,我们可以看到 npm5 在速度和使用上确实有了很大提升,值得尝试,不过还没有超过yarn。
综上我个人的建议是如果你已经在个人项目上使用 yarn,并且没有遇到更多问题,目前完全可以继续使用。但如果有兼容 npm 的场景,或者身处在使用 npm,cnpm,tnpm 的团队,以及还没有切到 yarn 的项目,那现在就可以试一试 npm5 了。
参考文章
原文:https://blog.csdn.net/weixin_39458031/article/details/86254375
原文链接:https://www.jianshu.com/p/254794d5e741
npm和yarn的区别,我们该如何选择?的更多相关文章
- npm和yarn的区别
npm和yarn的区别,我们该如何选择? 周一入职,同事JJ让我熟悉一下基于React的新项目.按照以往,我的步骤都是: git clone xxx npm install npm run dev 这 ...
- 一文看懂npm、yarn、pnpm之间的区别
文作者对比了当前主流的包管理工具npm.yarn.pnpm之间的区别,并提出了合适的使用建议,以下为译文: NPM npm是Node.js能够如此成功的主要原因之一.npm团队做了很多的工作,以确保n ...
- [转] 一文看懂npm、yarn、pnpm之间的区别
[From] http://geek.csdn.net/news/detail/197339 原文:Understanding differences between npm, yarn and pn ...
- 主流包管理工具npm、yarn、cnpm、pnpm之间的区别与联系——原理篇
接触 node 之后,一直使用npm包管理工具, cnpm 一开始会用一些,但是并没有觉得比 npm 快得多,使用 cnpm 的时候还经常安装不成功,只能再用 npm 安装一遍,渐渐的就弃用了 cnp ...
- npm npx cnpm yarn 的区别
npm npm 是 Node.js 官方提供的包管理工具.用于 Node.js 包的发布.传播.依赖控制.npm 提供了命令行工具,使你可以方便地下载.安装.升级.删除包,也可以让你作为开发者发布并维 ...
- Npm vs Yarn 之备忘大全
有则笑话,如此讲到:"老丈人爱吃核桃,昨天买了二斤陪妻子送去,老丈人年轻时练过武,用手一拍核桃就碎了,笑着对我说:你还用锤子,你看我用手就成.我嘴一抽,来了句:人和动物最大的区别就是人会使用 ...
- npm 还是 yarn ?
技术选型时这个问题总是困扰我,今天看到一篇文章,详细的解释了 npm 和 yarn 在性能,安全,支持性和使用难易度上的区别,看完之后这个问题终于有一个答案: 如果你在意速度和 UI,选 yarn,如 ...
- 包管理工具(npm、yarn)
npm包管理工具 1. npm的包安装分为本地安装(local).全局安装(global)两种,从敲的命令行来看,差别只是有没有-g而已. 2. 这两种安装方式的区别: 本地安装(安装在命令行运行所在 ...
- npm和yarn使用
npm和yarn使用 他们都属于js包管理工具,都可以安装包或者模块yarn 是由facebook.google等联合开发推出的 区别: npm 下载包的话 比如npm install,它是按照包的排 ...
随机推荐
- js移动端自适应动态设置html的fontsize
JS设计移动端页面时会遇到自适应问题,大多数都知道用rem来设置页面的比例大小,下面就来说几种常见的html中的fontsize设置方法: 1.使用flexible.js插件库. 淘宝就是利用这个来 ...
- pymongo和mongoengine安装和使用教程 包含常用命令行和代码示例 | pymongo and mongoengine tutorial on ubuntu 16.04
本文首发于个人博客https://kezunlin.me/post/e88f04e5/,欢迎阅读最新内容! pymongo and mongoengine tutorial on ubuntu 16. ...
- 从零开始学 ASP.NET Core 与 EntityFramework Core 目录
从零开始学 ASP.NET Core 与 EntityFramework Core 介绍 我是一个目录,它旨在帮助开发者循序渐进的了解 ASP.NET Core 和 Entity Framework ...
- Web前端基础(3):HTML(三)
1. body中的相关标签 1.1 表格标签:table.tr.td HTML表格由<table>标签以及一个或多个<tr>.<th>或<td>标签组成 ...
- linux上文件挂载的案例
cat /etc/fstab 将172.20.20.117上的172.20.20.117:/data/nfs/zichan/目录挂载到172.20.20.112机器上,其实类似目录共享 在需要挂载的机 ...
- 重启电脑 wamp图标是橙色(未变绿)
记录一个错误: 修复系统漏洞后,重启电脑,wamp没有开机自启动,手动启动后发现,图标是大红色变成了橙色,也就是服务未完全启动(1/2)状态. ??? 但是我其实也不知道是哪个服务(Apache/My ...
- Mysql—事务原理与详解
事务的四大特性 事务的隔离级别 https://www.cnblogs.com/57rongjielong/p/8036418.html https://blog.csdn.net/zwq123211 ...
- PHP转Go系列:数组与切片
数组的定义 用过PHP的同学应该很清楚,无论多么复杂的数据格式都可以用数组来表达,什么类型的数据都可以往里塞,它是工作必备的一部分,使用很简单,易用程度简直变态. $array = [1, 'name ...
- 安全类和远程类shell脚本
批量杀php小马脚本 find /home/hatdot/ -name "*.php" |xargs egrep "phpspy|c99sh|milw0rm|eval\( ...
- 15.Java基础_初探对象
package pack1; public class Phone { //成员变量 String brand; int price; //成员方法 public void call(){ Syste ...