React入門 | パッケージマネージャー(npm / yarn)
今までのJavaScript開発では、処理を全て1つのファイルに記載していたので、複雑なシステムの場合だとコードが数千行以上になりカオスな状態となっていた。
そこで少し改善されたJavaScript開発では、jsファイルから他のjsファイルを読み込んで使用できるようになったが、エラーが多発した。
そして現在のモダンJavaScript開発では、npmやyarnを用いることで以上の問題点を大幅に改善している。
パッケージマネージャーとは
パッケージの管理、インストール、アップデート等を担ってくれる管理ツールのこと。
- JavaScriptのnpm
- Rubyのgem
- PHPのcomposer
etc...
メリット
-依存関係を意識しなくても勝手に解決してくれる
-チーム内でのパッケージの共有や、バージョン統一が容易
-世界中で句会されているパッケージをコマンド1つで利用可能
-どこから読み込んだものか分かりやすくなった
まず世界中の人がパッケージの公開場所として使用しているのがNPMというレジストリ(一般的に大文字の場合はレジストリ、小文字の場合はパッケージマネージャーとしてのnpmを指すことが多い)。
インストール方法
npmの場合
npm install [パッケージ名]
yarnの場合
yarn add [パッケージ名]
上記コマンド実行時に、ローカルファイルのpackage.jsonが更新され、パッケージの情報が追記される。それと同時にnpmでインストールした場合はpackafelook.json、yarnでインストールした場合はyarn.lookファイルが生成される。lookファイルにはパッケージが内部で使用している別パッケージ等のバージョン情報や依存関係が記載される。
package.jsonとpackage-look.json(yarn.look)の2ファイルからモジュールを展開(同じ環境を作成)するのも非常に簡単で、以下のコマンドを実行するだけ。
npmの場合
npm install
yarnの場合
yarn install
コマンドを実行すると2つのファイルを参照してバージョンや依存関係が解決された状態で、node_modulesというフォルダが生成され、その中にパッケージの実体が展開される。
Discussion