【JS】yarnの長所とyarnからnpmに戻ってきた理由
こんにちは!npmはGitHub、そのGitHubはMicrosoftってことでフロントエンド周りをMSが制覇しつつある今日この頃を感じるMizutani(@sirycity)です。あとVSCodeとTypeScriptもMicrosoftだね!
今日はそんなMS帝国の一角、npmとそのライバル yarnについてです。僕は最初npmを使っていて、yarnが出たタイミングで乗り換えたけどまたnpmに戻ってきました。そんな話。
npmとyarnについて
npmとyarnについてざっくり説明します。
npmはJavaScriptの公式パッケージマネージャーです。結構昔からあるやつ。yarnはJavaScriptの非公式パッケージマネージャーです。後から出てきたやつで、npmの弱点を補うようなやつです。ソフトウェアあるあるだね。
yarnの方が良い所
機能としてはyarnの方が優秀と言って良いと思います。
厳密
昔のnpmはpackage.json
しかなかったです。yarnはyarn.lock
を作りました。これによってパッケージの依存関係がより厳密になりました。でもその後npmは同じ機能を持つpackage-lock.json
を作りました。だから今はあんまり変わらない。
速い
yarnの方が速いです。いろんな検証記事があるから見てみてね。npmがv6になってから差が縮まったけど、一応まだyarnが速い。
安全
チェックサムによるライブラリの整合性チェックをします。簡単に言うとパッケージをインストールする前にダウンロードされてきたファイルが改ざんされていないかを確認する...そうです。違ってたらごめん。
簡潔
yarnの方がコマンドが簡潔でした。今はもうそんなに差はないけど。詳しくは後述します!
yarnにしかない機能があった
例えばyarn run
とかupgrade-interactive
とか。もっとも、前者に関してはv5からnpxっていう同等の機能があり、後者に関してはncuってのがあります。
それでもnpmに戻った理由
こんな感じで全体的にyarnの方が優秀なのは自明です。僕もyarnが出た当初はすぐに乗り換えた。でも色々あって現在はnpmに戻りました。その理由について↓
npmがyarnの良い所を取り入れている
速度とかlockファイルとかは典型ですが、npmはyarnの良い所をパk積極的に取り入れています。yarnが出た当初に比べるとyarnとの差はほぼ無いと言っても良いかなー?と思います。
コマンドはnpmの方が簡潔まである
最近のnpmのコマンドはわりと省略できるので、むしろyarnよりもシンプルに書けたりするケースもあります。
昔のnpmはパッケージ追加するだけでこんな感じで...
npm install --save foo
npm install --save-dev foo
これに対してyarnはこんなに綺麗でした。
yarn add foo
yarn add --dev foo
こりゃyarn使いたくなるわ。ところが今のnpmは --saveがデフォルトになり、installやdevにもショートハンドができました。これらを駆使すると...
npm i foo
npm i -D foo
こんだけ。yarnより短い。(ただ可読性は落ちるので短いから良いかと言われると微妙です)
あとは削除とかグローバルとかもnpmの方が一応短いです。個人的にyarnのglobalの位置がちょっと間違えやすくて苦手...
npm r foo
yarn remove foo
npm i -g foo
yarn global add foo
滅茶苦茶いちゃもんだけど、yarnって名前が4文字で長いのでynとかにすれば良かったんじゃないかと思ってしまいました。JSで2文字のライブラリなんてjqとkyくらいしか思いつかんけど。
非公式であるが故の面倒くささがある
上述の通りnpmは公式、yarnは非公式です。故にyarnは使えるようになるまでに一動作あります。
例えばnpmはnodeをhomebrewで落とすだけで終わり。
brew install node
npm -v
一方yarnはbrewやnpmを経由してyarn自身を落とさないと駄目です。
brew install node
brew install yarn
yarn -v
これで何が困るかって言うと主に環境構築系。例えばnodeのバージョン管理にnodenvとかanyenvとか使っている人多いと思うけど、これらとyarnを併用しようとするとnodenv-yarn-installとかを使わなければならずめんどいです。
あとはCIとかでnode環境作ったりする時もひと手間かかります...が、最近は主なCIなら最初からyarnも入ってるしここはそんなに問題じゃないかも。
あとはなんだろう、なるべく余計なやつ入れたくないみたいな心理は...あるよね?
パッケージマネージャーを使ってる時間なんてそんなにない
実際に開発してる時にパッケージマネージャーに触り続けることなんてそんなにないです。全体の工程からしたらちょっとだけ。yarnは確かに性能は良いけど、なんかパッケージマネージャーのスペックはそんなにこだわらなくて良いかな?って思ってしまったりもします。
結論
好きな方使おう。
欲を言えば標準がnpmからyarnに変わって欲しい。JavaScriptはパッケージマネージャーが2つできた稀有な世界線ですが、そもそもパッケージマネージングの仕方が沢山あるpythonとかlockファイルのない(たしか)Javaとかもある世界です。Denoになればまた全然違う仕組みになるしね。JSを楽しみましょう。以上。
追記: pnpmについてもそのうち書きたい...
追記2: これだけnpmを推しておいてまたyarnに戻りました。
LINK
TAGS
LATESTS
POPULAR
- CSS2021/04/29【CSS】右寄せの方法は結局flexが一番良さそう
- React2020/07/13【JS】Reactのstyleの使い方、書き方いろいろ
- Payment2021/10/16GooglePayでVisaタッチを使う時に知っておきたい過酷な現実【追記あり】
- Others2021/07/11Slackに予約投稿機能ができて嬉しいけどそれでもまだ少し不満な理由【追記あり】
- CSS2020/04/30【CSS】tailwind.cssでよく使うデザインパターン
- CSS2019/03/30【CSS】100vhは「一画面」ではないという罠
- CSS2020/06/09【CSS】max-font-sizeやmin-font-sizeを使いたくなったら
- Vue2019/06/29【JS】Vueの:classの書き方3通り
- JavaScript2020/09/02【JS】yarnの長所とyarnからnpmに戻ってきた理由
- React2020/06/04【JS】ReactのclassNameの色々な書き方紹介