インストールが高速でディスク容量の節約になるpnpmを使おう

JavaScriptを利用したプロジェクトの開発環境を構築する際、npmやyarnといったパッケージ管理ツールは利用したことがあるでしょう。
今回紹介するpnpmもまた、JavaScriptのパッケージ管理ツールです。

npmやyarnよりも後発ということもあり、素晴らしいメリットがあるパッケージ管理ツールとなっています。
ぜひこの機会に触ってみましょう。

pnpmの特徴

pnpmは、2015年から運用が開始されているOSSのパッケージ管理ツールです。
公式が「npmより2倍速い」と謳っていることもあり、実際にパッケージインストールが体感できるほど速いです。

Yarn v3はさらに速い、というデータもありますが、PnP（Plug'n'Play）という仕組みを使っているおり、これは構造が従来のnpmの比較するには異なる点が多いため省きます。従来のnode_modulesを作るパッケージ管理の中で速いツール、という覚え方で問題ありません。

pnpmを使うメリット

pnpmのメリットを一覧にすると以下のようになります。

pnpmのインストール

公式ドキュメントを参考にするのが最も良いでしょう。

ただ、自分の環境では以下のようなエラーが出てしまったため、npmを使ったインストールを行いました。

$ curl -fsSL https://get.pnpm.io/install.sh | sh -
curl: (22) The requested URL returned error: 404
pnpm version '8.13.0' could not be found

npmでインストールする場合はこちら。

npm i -g pnpm

なお、試しにバージョン指定するとダウンロードが始まったので、環境によってはバージョンを指定しても良いでしょう。

curl -fsSL https://get.pnpm.io/install.sh | env PNPM_VERSION=8.12.1 sh -

以下のようにバージョンが返ってくれば成功です。

$ pnpm -v
8.12.1

pnpmのコマンド

基本的にnpmやyarnとあまり違いはありません。

pnpm add [パッケージ名] => パッケージインストール
pnpm install => npm installと同じ
pnpm update
pnpm remove
pnpm link (--global) => ローカルパッケージを別のディレクトリや全体にリンクさせる
pnpm unlink
pnpm import => 別パッケージ管理から移行するときに使える
pnpm rebuild => 再ビルド
pnpm prune => 不要パッケージ除去
pnpm fetch => Dockerイメージで使う
pnpm dedupe => 古い依存関係を削除してインストール
pnpm [コマンド] => npm run [コマンド]と同じ

Next.jsアプリケーションを作ってみる

試しに、Next.jsプロジェクトを立ち上げてみます。
yarnと同じく、以下のコマンドでNext.jsをインストールできます。（create-next-appではなく、create next-appであることに注意）

$ pnpm create next-app

以下の画像のように、依存関係を解決しながらインストールが進んでいく様子が見てわかります。Next.jsはnpm、yarnどちらであっても大差ありませんが、重いパッケージや多くのパッケージをインストールする際に恩恵を受けられるでしょう。

今のところデメリットを感じない

最近ほとんどのプロジェクトでpnpmを使うようになりましたが、今のところデメリットを感じていません。
もともとnpmやyarnを使っていたのであれば、難なく導入できるでしょう。

強く移行を進めるほどではありませんが、npmを使い続けていて「なんだか重いなぁ」と感じている方がいたら、ぜひpnpmを試してみてください。