资讯专栏INFORMATION COLUMN

Yarn 构建工具入门基础

tuniutech / 1169人阅读

摘要:就是一个类似于的包管理工具,它是由推出并开源。二的安装用法和基本工作流安装以为例你可以通过包管理工具安装。在使用一个包之前,你需要执行以下命令将其加入依赖项列表会被加入到文件中的依赖列表,同时也会被更新。

一、yarn的背景和介绍
一直以来,我们在安装和管理依赖的时候基本上都会使用npm,npm是一个非常优秀全面且广受欢迎的包管理工具,它奠定了前端模块化开发的基石,为前端的发展做出了不可磨灭的贡献。

yarn就是一个类似于npm的包管理工具,它是由facebook推出并开源。鉴于facebook在前端界的影响力,yarn一面世就很受瞩目,受到了前端界的广泛欢迎。

与npm相比,yarn有着众多的优势,主要的优势在于:速度快,离线模式,版本控制。

1、速度快。
npm会等一个包完全安装完才跳到下一个包,但yarn会并行执行包,因此速度会快很多。网上有不少比较npm和yarn安装同样多依赖的执行速度,yarn在速度方面优势明显。实际项目中体验一下真是飞一样的速度,谁有试过谁知道~

2、离线模式,
离线的原理比较简单,安装过的包会被保存进缓存目录,以后安装就直接从缓存中复制过来,这样做的本质还是会提高安装下载的速度,避免不必要的网络请求。

3、版本控制
npm用下来比较强的一个痛点就是:当包 的依赖层次比较深时,版本控制不够精确。会出现相同package.json,但不同人的电脑上安装出不同版本的依赖包,出现类似 “我电脑上是好的,没问题呀”的bug很难查找。你可以使用npm-shrinkwrap来实现版本固化,版本信息会写入npm-shrinkwrap.json文件中,但它毕竟不是npm的标准配置。
而yarn天生就能实现版本固化。会生成一个类似npm-shrinkwrap.json的yarn.lock文件,文件内会描述包自身的版本号,还会锁定所有它依赖的包的版本号:

yarn.lock存储这你的每个包的确切依赖版本,能确保从本地开发到生产环境,所有机器上都有精确相同的依赖版本。

二、yarn的安装、用法和基本工作流
1、安装(以mac为例)
Homebrew
你可以通过 Homebrew 包管理工具安装 Yarn。 如果你还未安装 Node.js,Homebrew 会自动为你安装。

brew update
brew install yarn
设置路径
你需要设置你终端的 PATH 环境变量,以便全局访问 Yarn 的可执行文件。
添加export PATH="$PATH:yarn global bin"到你的 profile 文件(也可能是 .profile、.bashrc、.zshrc 等文件)。

2、用法
初始化一个新的项目

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
or

yarn install

3、工作流
对于依赖管理来说,在项目中使用一个新的包管理器就是使用了一个新的工作流。 Yarn 将尽其最大的努力不侵入你的工作方式,并且使其工作流中的每一步都能简单易懂。

您需要知道一些基本的工作流的知识:

创建一个新的项目
添加/更新/删除依赖包
安装/重新安装依赖包
使用版本管理工具(例如 git)
持续集成

(1)、创建一个新项目
不论是已经有了现成的代码仓库(目录),还是正着手启动一个全新项目,你都可以使用同样的方法引入Yarn。
在命令行终端里,跳转到准备引入Yarn的目录(通常是一个项目的根目录),执行以下命令:

yarn init

这将打开一个用于创建Yarn项目的交互式表单,其中包含以下问题:

name (your-project):
version (1.0.0):
description:
entry point (index.js):
git repository:
author:
license (MIT):

你既可以回答这些问题,也可以直接敲回车键(enter/return)使用默认配置或者留空。

现在应该创建了一个和下面文件内容类似的 package.json:

{
"name": "my-new-project",
"version": "1.0.0",
"description": "My New Project description.",
"main": "index.js",
"repository": {

"url": "https://example.com/your-username/my-new-project",
"type": "git"

},
"author": "Your Name ",
"license": "MIT"
}

执行yarn init之后,除了以上文件被创建之外,没有任何副作用。你可以随意编辑此文件。
package.json文件里存储了项目的有关信息。 包括项目名称、维护者信息、代码托管地址,以及最重要的:项目依赖。

(2)、管理依赖项
你需要了解几若干个用于增加、更新、删除依赖项的命令。
每个命令都会更新package.json和yarn.lock 文件。

在使用一个包之前,你需要执行以下命令将其加入依赖项列表:

yarn add [package]
[package]会被加入到package.json文件中的依赖列表,同时yarn.lock也会被更新。

{

"name": "my-package",
"dependencies": {

"package-1": "^1.0.0"
}
}

你可以用以下参数添加其它类型的依赖:

yarn add --dev 添加到 devDependencies
yarn add --peer 添加到 peerDependencies
yarn add --optional 添加到 optionalDependencies
通过指定依赖版本和标签,你可以安装一个特定版本的包:
yarn add [package]@[version]
yarn add [package]@[tag]
[version] 或 [tag] 会被添加到 package.json,并在安装依赖时被解析。
例如:

yarn add package-1@1.2.3
yarn add package-2@^1.0.0
yarn add package-3@beta
{
"dependencies": {

"package-1": "1.2.3",
"package-2": "^1.0.0",
"package-3": "beta"

}
}

更新依赖包

yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]
这会更新package.json和yarn.lock 文件。

{

"name": "my-package",
"dependencies": {

"package-1": "^1.0.0"

"package-1": "^2.0.0"
}
}

删除依赖包

yarn remove [package]
这会更新package.json和yarn.lock 文件。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/97752.html

相关文章

  • node入门基础

    摘要:入门是一门基于的后台编程语言,由于其解析引擎为引擎,性能比较强大,再加上与前端语言关系更为密切的先天优势,使其在众多后台编程语言中脱颖而出。那么线程呢,线程,有时被称为轻量级进程,,是程序执行流的最小单元。 node入门 nodejs是一门基于JavaScript的后台编程语言,由于其解析引擎为V8引擎,性能比较强大,再加上与前端语言关系更为密切的先天优势,使其在众多后台编程语言中脱颖...

    wujl596 评论0 收藏0
  • 2018前端值得关注的技术

    摘要:年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。自从谷歌提出后,就持续的获得了业界的关注,热度可见一斑。就在今年,谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家...

    xiao7cn 评论0 收藏0
  • 2018前端值得关注的技术

    摘要:年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。自从谷歌提出后,就持续的获得了业界的关注,热度可见一斑。就在今年,谷歌也宣布将获得与安卓原生应用同等的待遇与权限。但是无论都值得关注。 1.前言 2017悄然过去,2018已经来到。人在进步,技术在发展。2018年前端有哪些领域,技术值得关注,哪些技术会兴起,哪些技术会没落。下面就我个人的判断进行一个预测判断,希望能对大家...

    用户84 评论0 收藏0
  • Laravel学习笔记三-前端工作流

    摘要:本节将学习是如何利用形成一套完整的前端工作流模式的。你也可以使用下面命令来强制安装所有模块,不管该模块之前是否安装过由于国内墙的原因,使用安装会非常缓慢,慢到想切,不过还好,我们可以使用淘宝提供的国内镜像进行下载。 本节将学习 Laravel 是如何利用 Sass, NPM, Gulp形成一套完整的前端工作流模式的。 一、句法强大的样式表Sass Sass 是一种可用于编写CSS的语言...

    liuchengxu 评论0 收藏0
  • Spark 快速入门

    摘要:数据科学任务主要是数据分析领域,数据科学家要负责分析数据并建模,具备统计预测建模机器学习等方面的经验,以及一定的使用或语言进行编程的能力。监控运行时性能指标信息。 Spark Spark 背景 什么是 Spark 官网:http://spark.apache.org Spark是一种快速、通用、可扩展的大数据分析引擎,2009年诞生于加州大学伯克利分校AMPLab,2010年开源,20...

    wangshijun 评论0 收藏0

发表评论

0条评论

最新活动
阅读需要支付1元查看
<