ページ

2016年10月15日土曜日

Facebook製の新しいパッケージ管理ツール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の代わりに使ってみたいと思います。

0 件のコメント:

コメントを投稿