#概要
・npm互換のフロントエンドパッケージマネージャー
・facebookが開発した
・npmと同じことをできる
・npmとコマンドがちょっと違う（結構似てる）
※npmが分からない人はこちらの記事を先にチェック
npmとは？
npmと比べたメリット
・パッケージインストールが早い
→キャッシュ利用したり、並行インストールしたりできる
・メンバー間での厳格なバージョン固定共有が可能
→yarn.lockファイルによってバージョン固定される
#使い方
・yarn init
→package.jsonが作られる
・yarn install（開発時はこうする）
[yarn.lockがすでにある場合]
→package.jsonのdependenciesとdevDependenciesに書かれているパッケージをインストールする
→各パッケージはyarn.lockに記載されているバージョンがインストールされる
[yarn.lockがない場合]
→package.jsonのdependenciesとdevDependenciesに書かれているパッケージをインストールする
→yarn.lockを作成し、インストールした各パッケージのバージョン情報を記述する
※省略して yarn だけでも実行できる
・yarn install --production（本番環境ではこうする）
→package.jsonのdependenciesに書かれているパッケージをインストールする
→各パッケージはyarn.lockに記載されているバージョンがインストールされる
・yarn add {パッケージ名}
→そのパッケージがpackage.jsonのdependenciesに追記される
→yarn.lockにインストールしたパッケージのバージョンが追記される
→本番環境だけで必要なパッケージはこうする
・yarn add --dev {パッケージ名}
→そのパッケージがpackage.jsonのdevDependenciesに追記される
→yarn.lockにインストールしたパッケージのバージョンが追記される
→開発時のみ必要なパッケージはこうする
→例えばテストツールやデバッグツールなど
・yarn upgrade {パッケージ名}
→package.jsonに記述されている範囲でそのパッケージが更新される
→更新したバージョンがyarn.lockに記載される
→パッケージ名を省略すれば全パッケージが更新される
開発時の流れ
最初にプロジェクト作成する人
・yarn init でpackage.jsonを作成
・yarn add {パッケージ名}で本番用パッケージをpackage.jsonに追加&yarn.lockにバージョン情報追加
・yarn add --dev {パッケージ名}で開発用パッケージをpackage.jsonに追加&yarn.lockにバージョン情報追加
・package.jsonとyarn.lockをプッシュして共有
プロジェクトに参加したメンバーたち
・yarn intall でみんなと同じパッケージをインストール
※この時、各パッケージはyarn.lockに記述されているバージョンがインストールされるため、チームメンバーと同一バージョンをインストール可能
新しいパッケージを入れるとき
・yarn add {パッケージ名} でインストールしてローカルで動作確認
・package.jsonとyarn.lockをプッシュして共有
タスクランナーとして利用
npmと同様に、yarnもタスクランナーとして利用可能。
package.json の scripts にコマンドを記述。
"scripts": {
"{呼び出しキーワード}": "{実行されるシェルコマンド}"
}
そして、
yarn run {呼び出しキーワード}
のように実行すれば、package.jsに記述したシェルコマンドが実行される。
例えば
babel変換やwebpackのバインド処理など
長くてオプションが複雑なコマンドを、
build のような短いキーワードで登録しておき
yarn run build だけで実行できるようにしたりする。
yarn自体のインストール
windows、mac
公式サイトからインストーラダウンロード
https://yarnpkg.com/en/docs/install#windows-stable
##linux
###debian
sudo apt update && sudo apt install yarn
###centos
sudo yum install yarn
#参考
https://ics.media/entry/13838/
https://qiita.com/senou/items/d939601e32c0005ebfe3
https://yarnpkg.com/ja/
https://yuta-yamamoto.hatenablog.com/entry/2018/11/12/222001