利用yarn代替npm管理前端项目模块依赖的方法详解


Posted in Javascript onSeptember 04, 2017

本文主要给大家介绍了关于yarn代替npm管理前端项目模块依赖的相关内容,分享出来供大家参考学习,下面话不多说了,来一起看看详细的介绍吧。

什么是 yarn?

简单来说,yarn 是一个与 npm 功能相同的工具,用于前端项目的依赖管理。在使用 npm 的项目中,使用 npm 命令的地方都可以使用 yran 来代替。

为什么要使用 yarn 替代 npm 呢?yarn 相对 npm 来说,主要的特点有:

  • 离线、并行安装:依赖并行安装,缓存已下载过的依赖并优先使用,各种优化使得安装依赖速度显著提升
  • 确定性:默认生成 yarn.lock 文件,可以保证各开发人员开发安装依赖的目录具有一致性
  • more…

好吧,其实 npm 也在不断的优化改进中。但 yarn 确实有很多亮点,至少当前是非常值得你去使用的。

yarn 使用快速上手

安装

虽然安装 yarn 可以不依赖 npm,但这里还是建议你使用 npm 来安装吧,快速而简洁:

npm i -g yarn

在项目中使用

首次初始化项目时执行,在每次项目启动/构建之前,也都应执行一次,以保证本地依赖得到及时更新。

该命令会检查 package.json 和 yarn.lock 文件中的依赖,当有其内容更新,会进行依赖更新安装。

yarn <install>

依赖更新。当你希望更新依赖模块到其最新版本时执行该命令。

yarn upgrade

yarn 常用命令

开始新项目

yarn init

添加依赖包

yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]

升级依赖包

yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]

移除依赖包

yarn remove [package]

安装项目的全部依赖

yarn

或者

yarn install

yarn 使用实践建议

我们选择 yarn 的主要原因是依赖安装速度快,默认生成的 yarn.lock 会保证所有成员的模块依赖目录能够很好的保持一致。

yarn install 和 yarn upgrade 的执行逻辑,可以让你可以很清晰的管理本地依赖的版本更新时机,又能很好的让所有开发人员的本地依赖保持一致性。

使用 npm install 则有些乱,当你不想写死版本号依赖时,它总会安装依赖包最新可用的版本,但这在有时候并不是你想要的。

在 yarn 之前,我们使用的是 npm+淘宝仓库方案,也会使用 cnpm。在国内,cnpm 的依赖安装速度比 yarn 还要快,但 cnpm 在 windows 下通过创建链接引用的方式管理包依赖,可能会带来一些问题。

现在我们会默认使用淘宝仓库,使用 npm 管理全局依赖,使用 yarn 管理具体项目内的依赖。

在一个新的项目中使用 yarn,我们会这么来做:

  • 写好 package.json,写入初始的第三方依赖
  • 执行 yarn 命令,初始化安装项目依赖,生成 yarn.lock 文件
  • 后续通过执行 yarn add xxx 添加更多需要的依赖(也可直接在 package.json 文件中写入)
  • 当确定需要更新依赖模块到其最新版本时,执行 yarn upgrade 命令
  • 配置项目启动命令执行前,先执行 yarn 命令,以保证当 yarn.lock 被更新时,本地依赖也及时得到更新。例如,在 package.json 的 script 部分中配置 start 命令: "start": "yarn && yarn run build:dev"

你是如何来使用 yarn 的呢?欢迎分享你的经验。

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

相关参考

npm https://docs.npmjs.com
yarn https://yarnpkg.com

Javascript 相关文章推荐
innerHTML,outerHTML,innerTEXT三者之间的区别
Jan 28 Javascript
js下弹出窗口的变通
Apr 18 Javascript
javascript arguments 传递给函数的隐含参数
Aug 21 Javascript
jquery插件推荐 jquery.cookie
Nov 09 Javascript
javascript实现一个数值加法函数
Jun 26 Javascript
JS实现的鼠标跟随代码(卡通手型点击效果)
Oct 26 Javascript
jQuery实现滚动鼠标放大缩小图片的方法(附demo源码下载)
Mar 05 Javascript
关于Vue.js一些问题和思考学习笔记(2)
Dec 02 Javascript
jQuery实现百度图片移入移出内容提示框上下左右移动的效果
Jun 05 jQuery
微信小程序获取用户绑定手机号方法示例
Jul 21 Javascript
JS实现打砖块游戏
Feb 14 Javascript
原生JS实现分页
Apr 19 Javascript
JS实现匀加速与匀减速运动的方法示例
Sep 04 #Javascript
node-sass安装失败的原因与解决方法
Sep 04 #Javascript
使用MUI框架模拟手机端的下拉刷新和上拉加载功能
Sep 04 #Javascript
JS图片延迟加载插件LazyImgv1.0用法分析【附demo源码下载】
Sep 04 #Javascript
React教程之Props验证的具体用法(Props Validation)
Sep 04 #Javascript
VueJS组件之间通过props交互及验证的方式
Sep 04 #Javascript
vue中component组件的props使用详解
Sep 04 #Javascript
You might like
深入php数据采集的详解
2013/06/02 PHP
php计算当前程序执行时间示例
2014/04/24 PHP
php nginx 实时输出的简单实现方法
2018/01/21 PHP
疯掉了,尽然有js写的操作系统
2007/04/23 Javascript
几个比较实用的JavaScript 测试及效验工具
2010/04/18 Javascript
关于用Jquery的height()、width()计算动态插入的IMG标签的宽高的问题
2010/12/08 Javascript
jquery星级插件、支持页面中多次使用
2012/03/25 Javascript
基于dropdown.js实现的两款美观大气的二级导航菜单
2015/09/02 Javascript
JS实现漂亮的淡蓝色滑动门效果代码
2015/09/23 Javascript
vue中计算属性(computed)、methods和watched之间的区别
2017/07/27 Javascript
Vue.js通用应用框架-Nuxt.js的上手教程
2017/12/25 Javascript
帮你彻底搞懂JS中的prototype、__proto__与constructor(图解)
2019/08/23 Javascript
node.js express框架实现文件上传与下载功能实例详解
2019/10/15 Javascript
[07:25]DOTA2-DPC中国联赛2月5日Recap集锦
2021/03/11 DOTA
[07:54]DOTA2-DPC中国联赛 正赛 iG vs VG 选手采访
2021/03/11 DOTA
Python标准库之随机数 (math包、random包)介绍
2014/11/25 Python
Python中修改字符串的四种方法
2018/11/02 Python
python去除拼音声调字母,替换为字母的方法
2018/11/28 Python
如何在Django中添加没有微秒的 DateTimeField 属性详解
2019/01/30 Python
详解Python3 对象组合zip()和回退方式*zip
2019/05/15 Python
pandas DataFrame行或列的删除方法的实现示例
2019/08/02 Python
Python for循环搭配else常见问题解决
2020/02/11 Python
使用PyQt的QLabel组件实现选定目标框功能的方法示例
2020/05/19 Python
Python文件夹批处理操作代码实例
2020/07/21 Python
matplotlib之pyplot模块之标题(title()和suptitle())
2021/02/22 Python
创造美妙香氛体验:Aera扩散器和香水
2018/11/25 全球购物
英国领先的豪华时尚家居网上商店:Amara
2019/08/12 全球购物
生产部岗位职责范文
2014/02/07 职场文书
优秀辅导员事迹材料
2014/02/16 职场文书
星级党支部申报材料
2014/05/31 职场文书
社区志愿者活动总结
2014/06/26 职场文书
珠宝的促销活动方案
2014/08/31 职场文书
县政府领导班子“四风”方面突出问题整改措施
2014/09/23 职场文书
六五普法宣传标语
2014/10/06 职场文书
Win11怎么解除儿童账号限制?Win11解除微软儿童账号限制方法
2022/07/07 数码科技
如何让你的Nginx支持分布式追踪详解
2022/07/07 Servers