Yarnについてまとめました。
Yarnについて理解すべきことは以下です。
- Yarnはnpmより高速でセキュリティが強化されたJavaScriptのパッケージ管理ツール
- Yarn自体はnpmを使ってパッケージをインストールする必要がある
- Yarnの設定はnpm同様、
package.jsonで行う - Yarnでは
package-lock.jsonではなく、yarn-lockを使う
Yarnとは
Yarnは、Facebookが開発したJavaScriptのパッケージ管理システム。
Yarnの他にJavaScriptのパッケージ管理システムにはnpmがあるが、Yanrはnpmに比べて高速でセキュリティが強化されている。
使い方はnpmと同じだが、コマンドが少し異なる。
Yarn自体をインストール
Yarnをインストールするにはnpmを使う。npmはNode.jsをインストールすると一緒にインストールされる。
npm install -g yarn
-gはグローバルにインストールすることで、PC全体で使えるようにすること。
グローバルの反対はローカルインストールであり、プロジェクトごとにインストールすること。ローカルの場合は-gをつけない。
基本的なコマンド
Yarnの基本的なコマンドは以下の通り。
| コマンド | 意味 |
|---|---|
| yarn init | package.jsonを作成する |
| yarn install | パッケージをインストールする |
| yarn add | パッケージをインストールする |
| yarn remove | パッケージを削除する |
| yarn upgrade | パッケージを更新する |
| yarn remove | パッケージを削除する |
| yarn cache clean | キャッシュをクリアする |
| yarn run [script] | スクリプトを実行する |
| yarn -v | yarnのバージョンを確認する |
Yarnを使う流れ
Yarnは以下の流れで使う。
- プロジェクトに
package.jsonがなければyarn initで作成する - 必要なパッケージをインストールする
- パッケージを使って何らかの設定をしたり、機能を実装する・スクリプトを実行する
1. プロジェクトにpackage.jsonがなければyarn initで作成する
パッケージを管理するために必要なpackage.jsonを作成するためにyarn initを実行する。そのまま実行するといくつか質問を聞かれるが、-yをつけることで質問をスキップできる。
package.jsonの詳細についてはnpmの記事で説明している。
create-react-appやViteを使って環境構築を行なった場合は、自動的に作られる。
2. 必要なパッケージをインストールする
プロジェクトに必要なパッケージをインストールする。
インストールの仕方はyarn addを実行して直接パッケージをインストールする方法と、package.jsonとyarn.lockに基づいてyarn installを実行してインストールする方法の2つある。
yarn addでインストールする方法
yarn addは主に特定のパッケージをインストールするために使われる。
# 本番環境で使うパッケージをインストールする yarn add [パッケージ] # -Dをつけると開発環境でのみ使うパッケージをインストールする yarn add -D [パッケージ]
パッケージをインストールが完了すると、プロジェクトのルートにyarn.lockというファイルと、node_modulesというディレクトリが作られる。yarn.lockとnode_modulesについては後述。
yarn installでインストールする方法
yarn installは実行すると、package.jsonのyarn.lockに記述されているパッケージとその依存関係がインストールされる。
この方法は開発者で環境を統一するために使う。
yarn install
package.jsonのdependenciesかdevDependenciesにインストールしたいパッケージとそのバージョンを記述する。
dependenciesには本番環境で必要なパッケージを記述し、devDependenciesには開発環境で必要なパッケージを記述する。
3. パッケージを使って何らかの設定をしたり、機能を実装する・何らかのスクリプトを実行する
パッケージをインストールできたら、それらを使って任意の設定や機能を実装する。
他にもスクリプトを実行したりする。
スクリプトはpackage.jsonのscriptsに書かれているもので、プロジェクトのビルドやテストの実行など、何らかのコマンドを実行するためのもの。
スクリプトはyarn run [script]で実行する。
ReactやNext.jsではさまざまなパッケージが必要になるので、パッケージのインストールやスクリプトを実行することで環境構築を行う。
yarn.lock
yarn.lockは、プロジェクトの依存関係とそのバージョンを追跡するための重要なファイルで、Yarnを使ってパッケージをインストールしたときに作られる。
このファイルには、プロジェクトにインストールされた各パッケージの正確なバージョンが記録される。これにより再現性が高まり、プロジェクトの開発環境を安定させることができる。
yarn.lockはnpmのpackage-lock.jsonにあたる。
node_modules
node_modulesは実際にインストールしたパッケージが格納されるディレクトリで、パッケージをインストールすると作られる。
Gitを使う場合、.gitignoreファイルにnode_modules/と記述してGitの管理から外す。
