この記事の要点
• pnpmのインストールと基本コマンドの使い方
• ワークスペースによるモノレポ管理
• npmからの移行手順とベストプラクティス
このチュートリアルで学ぶこと
- pnpmのインストール
- 基本コマンド
- ワークスペース設定
- npmからの移行
Step 1: インストール
実践メモ: Node.js 16.13以降を使っている場合は、corepackでの管理が推奨です。チーム全員が同じバージョンのpnpmを使えるようになります。
# npm
npm install -g pnpm
# Homebrew
brew install pnpm
# corepack（Node.js 16.13+）
corepack enable
corepack prepare pnpm@latest --activate
Step 2: 基本コマンド
# パッケージインストール
pnpm install
# 依存関係追加
pnpm add express
pnpm add -D typescript
# 削除
pnpm remove express
# スクリプト実行
pnpm run dev
pnpm dev # runは省略可能
# 更新
pnpm update
pnpm update --latest
Step 3: ワークスペース設定
ポイント: pnpm-workspace.yamlでワークスペースのパッケージ配置を定義します。apps/*にはアプリケーション、packages/*には共有ライブラリを配置するのが一般的です。
# pnpm-workspace.yaml
packages:
- 'apps/*'
- 'packages/*'
// package.json
{
"name": "my-monorepo",
"private": true,
"scripts": {
"dev": "pnpm -r dev",
"build": "pnpm -r build"
}
}
Step 4: ワークスペース内操作
# 特定パッケージにインストール
pnpm add lodash --filter web
# 内部パッケージを参照
pnpm add @repo/ui --filter web --workspace
# 全パッケージで実行
pnpm -r run build
# 並列実行
pnpm -r --parallel run dev
Step 5: package.jsonの依存関係
workspace:*プロトコルを使うと、ローカルパッケージを自動的にリンクできます。
// apps/web/package.json
{
"dependencies": {
"@repo/ui": "workspace:*",
"@repo/utils": "workspace:^1.0.0"
}
}
Step 6: npmからの移行
注意: 移行時はnode_modulesとpackage-lock.jsonを必ず削除してからpnpmでインストールしてください。残っていると依存関係の不整合が発生します。
# node_modules削除
rm -rf node_modules
# package-lock.json削除
rm package-lock.json
# pnpmでインストール
pnpm import # package-lock.jsonから変換
pnpm install
Step 7: 設定ファイル
shamefully-hoistは、一部のパッケージがフラットなnode_modules構造を前提としている場合に必要です。
# .npmrc
shamefully-hoist=true
strict-peer-dependencies=false
auto-install-peers=true
ベストプラクティス
- corepackで管理
- pnpm-lock.yamlをコミット
- .npmrcでプロジェクト設定
- workspace:*で内部参照
まとめ
pnpmはディスク効率が良く高速なパッケージマネージャーです。ワークスペース機能でモノレポも簡単に管理できます。