What

Yarn 是由 Facebook、Google、Exponent 和 Tilde 联合推出了一个新的 JS包管理工具。

更多的具体特性介绍可参考：Yarn 官网

Why

官网标语：快速、可靠、安全的依赖管理

Yarn 的优点体验下来主要有：

  • 快：并行安装及离线模式提升了安装包的速度（镜像被墙的问题与工具无关，详见下文）
  • 版本统一：yarn.lock 一定程度上固化了依赖；类似 package-lock.json
  • 命令简易：yarn init yarn add yarn remove 等命令感觉比 npm 方便

VS npm

作为 JS 包管理工具，一定会与 npm 作为比较，而事实上，Yarn 是为了弥补 xpm 的一些缺陷而出现的。当然 npm 也一直在迭代更新，具体的区别和优势，可参考博文：npm和yarn的区别，我们该如何选择?

具体用 yarn 还是 npm，还是看团队及个人喜好吧，个人因为 create-react-app 推荐使用了 yarn，之前用的都是 npm，的确感觉 npm 有不少包冲突的坑，新的前端项目会选择使用 yarn。

How

基础使用

  1. 安装：参考 官网-新手指南-安装
  2. 使用：参考 官网-新手指南-使用，基本使用足够了

常用命令列举如下：

  • 初始化 yarn init
  • 添加包
# 指定版本及标签
yarn add [package]
yarn add [package]@[version]
yarn add [package]@[tag]
# 添加依赖类别
yarn add [package] --dev
yarn add [package] --peer
yarn add [package] --optional
  • 升级包
yarn upgrade [package]
yarn upgrade [package]@[version]
yarn upgrade [package]@[tag]
  • 移除包 yarn remove [package]
  • 安装项目的全部依赖 yarn 或者 yarn install

注意： 由于某些原因，Yarn 需要使用国内镜像，方式如下：

# 设置 yarn 镜像源为淘宝镜像
yarn config set registry https://registry.npm.taobao.org/
# 查看 yarn 当前镜像源
yarn config get registry

有关国内镜像，更多可参考 google 搜索 yarn 国内镜像源

更多 Yarn 的使用请参考官网的 其他文档

Demo

创建空工作目录，yarn init 初始化项目，发现新建了一个 package.json 文件，查看如下：

➜ cat package.json
{
  "name": "test",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT"
}

使用 yarn add vue，打印如下：

➜ yarn add vue
yarn add v1.16.0
info No lockfile found.
[1/4]  Resolving packages...
[2/4]  Fetching packages...
[3/4]  Linking dependencies...
[4/4]  Building fresh packages...

success Saved lockfile.
warning Your current version of Yarn is out of date. The latest version is "1.17.3", while you're on "1.16.0".
info To upgrade, run the following command:
$ brew upgrade yarn
success Saved 1 new dependency.
info Direct dependencies
└─ vue@2.6.10
info All dependencies
└─ vue@2.6.10
Done in 8.69s.

安装完成 vue 后，新增 node_modules 包文件夹以及 yarn.lock 文件

➜  ls
node_modules package.json yarn.lock

查看 package.json，加入了 dependencies

  "dependencies": {
    "vue": "^2.6.10"
  }

以及 yarn.lock 文件

# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1


vue@^2.6.10:
  version "2.6.10"
  resolved "https://registry.npm.taobao.org/vue/download/vue-2.6.10.tgz#a72b1a42a4d82a721ea438d1b6bf55e66195c637"
  integrity sha1-pysaQqTYKnIepDjRtr9V5mGVxjc=