Facebook製の新しいパッケージ管理ツールyarnを試してみる

yarn

Javascriptのパッケージ管理といえばnpmですが、
yarnはnpmに比べてどうなのか試してみました。

と言う訳で、早速試してみたいと思います。

環境準備 & インストール

---

環境としてはMacOS、Windows、Linuxで使用できます。
筆者はMacOSで試しました。

前提としてNode.jsのインストールが必要になります。

今回はHomebrewを使ってyarnをインストールしますが、
他にもスクリプトからや、tarballをダウンロードしてからもインストールできます。

$ brew update
$ brew install yarn

パッケージインストール

---

yarnはpackage.jsonを使ってインストールもできるので、
以前作成したReact開発用でのpackage.jsonを使ってみたいと思います。

• package.json

{
  "name": "Template",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "build": "webpack",
    "start": "webpack-dev-server --progress --colors",
    "lint": "eslint src --ext .js --ext .jsx"
  },
  "author": "",
  "license": "MIT",
  "devDependencies": {
    "babel-core": "^6.11.4",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.9.0",
    "babel-preset-react": "^6.11.1",
    "eslint": "^3.3.0",
    "eslint-plugin-react": "^6.2.0",
    "react": "^15.3.0",
    "react-dom": "^15.3.0",
    "webpack": "^1.13.2",
    "webpack-dev-server": "^1.16.1"
  }
}

パッケージインストール

$ yarn install
yarn install v0.15.1
info No lockfile found.
[1/4] 🔍  Resolving packages...
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
[4/4] 📃  Building fresh packages...
success Saved lockfile.
✨  Done in 29.16s.
yarn install  14.32s user 5.98s system 68% cpu 29.814 total

※時間を計測する為にtimeコマンドを使用してます。

なんか絵文字があったりnpmよりシャレた感じですw
インストールされるとディレクトリ直下にyarn.lockが作成されます。

• yarn.lock

# THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
# yarn lockfile v1
abbrev@1:
  version "1.0.9"
  resolved "https://registry.yarnpkg.com/abbrev/-/abbrev-1.0.9.tgz#91b4792588a7738c25     f35dd6f63752a2f8776135"

accepts@~1.3.3:
  version "1.3.3"
  resolved "https://registry.yarnpkg.com/accepts/-/accepts-1.3.3.tgz#c3ca7434938648c3     e0d9c1e328dd68b622c284ca"
  dependencies:
    mime-types "~2.1.11"
    negotiator "0.6.1"

省略・・・

package.jsonより細かいパッケージの情報が書かれています。Gemfile.lockみたいな感じですね

ちなみにnpmで同様のパッケージをインストールしてみました。

$ npm install
...
npm install  33.22s user 8.36s system 95% cpu 43.549 total

インストール時間に関してはyarnが29.814s、
npmが43.549sなのでyarnの方が早いです。

またパッケージの重複に関してもyarnの方が整理されています。
試しにisarrayパケージをnode_modules内で検索してみると

• npm

$ find . -name isarray -type d
./node_modules/fsevents/node_modules/isarray
./node_modules/isarray
./node_modules/node-libs-browser/node_modules/isarray
./node_modules/stream-browserify/node_modules/isarray

• yarn

$ find . -name isarray -type d
./node_modules/isarray
./node_modules/readable-stream/node_modules/isarray

yarnの方が整理されています。

その他

---

yarnはnpm同様に以下コマンドが使えます。

• package.json作成

$ 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の方が便利そうですが、、
しばらくnpmの代わりに使ってみたいと思います。