Skip to content

Lesson 11: 依存パッケージの管理

クラス: 初級
所要時間: 約35分
前提知識: 初級 Lesson 1〜10 完了済み


1. 解説

package.json の構造と管理

json
{
  "dependencies": {
    "express": "^4.18.0"  // 本番で必要
  },
  "devDependencies": {
    "jest": "^29.0.0"     // 開発時だけ必要
  }
}

バージョン指定の読み方:

記法意味
"4.18.0"厳密にこのバージョン
"^4.18.0"4.x.x の最新(メジャーは固定)
"~4.18.0"4.18.x の最新(マイナーも固定)
"*"何でも(危険)

Claude Code で依存パッケージを管理する

bash
# パッケージの調査
「express fastify を比較してください。どちらが今回の用途に適しますか?」

# package.json の整理
「package.json を読んで、不要なパッケージがないか確認してください」

# 脆弱性の確認
「npm audit の結果を読んで、対処が必要な脆弱性を教えてください」

# バージョン更新の影響確認
「express v4 から v5 に更新する場合、何が変わりますか?」

よくある依存関係の問題

1. 依存関係の競合
   → npm install がエラーになる

2. セキュリティ脆弱性
   → npm audit で発見できる

3. バージョンの固定不足
   → CI/CDで再現性がない

4. 不要な依存の肥大化
   → node_modules が巨大になる

2. 実践

Step 1: プロジェクトの依存状況を分析

bash
mkdir -p ~/claude-practice/elementary/lesson11
cd ~/claude-practice/elementary/lesson11

cat > package.json << 'EOF'
{
  "name": "sample-app",
  "version": "1.0.0",
  "dependencies": {
    "express": "^4.18.0",
    "lodash": "^4.17.21",
    "moment": "^2.29.0",
    "request": "^2.88.0",
    "colors": "^1.4.0",
    "underscore": "^1.13.0"
  },
  "devDependencies": {
    "mocha": "^10.0.0",
    "chai": "^4.3.0",
    "jest": "^29.0.0",
    "jasmine": "^5.0.0"
  }
}
EOF
bash
claude
package.json を読んで、依存パッケージを分析してください:
1. 重複・競合しているパッケージはありますか?
2. 非推奨・廃止されたパッケージはありますか?
3. 軽量な代替パッケージがあるものを教えてください
4. devDependencies に入れるべきものが dependencies にないか確認してください

Step 2: パッケージの比較と選定

moment.js の代替として day.js または date-fns が推奨されています。
このプロジェクトで date-fns を使うべき理由と、
移行時に注意すべき点を教えてください。

Step 3: package.json の最適化

package.json を最適化してください:
- 重複するテストフレームワークを1つ(jest)に統一
- 非推奨パッケージを代替に変更
- バージョン指定を適切に調整
変更内容とその理由を説明してください。

Step 4: npm scripts の整備

package.json に以下の npm scripts を追加してください:
- start: Node.js でアプリを起動
- dev: nodemon でホットリロードしながら起動
- test: jest でテスト実行
- test:watch: ウォッチモードでテスト
- lint: eslint でコードチェック
- build: 本番用ビルド(もしあれば)

3. 確認課題(Assignment)

課題 11-1: 脆弱性の調査と対処

bash
# npm audit を実行(実際の脆弱性がなければ仮想シナリオで進める)
npm install 2>/dev/null || true

以下のシナリオを Claude Code に相談:

npm audit で以下が報告されました:

  lodash <=4.17.20  Severity: high
  Prototype Pollution - https://npmjs.com/advisories/1523
  fix available via `npm audit fix`

  request *  Severity: moderate
  Server-Side Request Forgery - request is deprecated
  No fix available

これらへの対処方法を教えてください。

達成条件: 各脆弱性への適切な対処(更新/代替/リスク受容)が提案されること

課題 11-2: package-lock.json の理解

bash
npm install --package-lock-only 2>/dev/null || echo "skipped"
package-lock.json(または npm-shrinkwrap.json)の役割を説明してください。
「なぜ package.json だけでなく lock ファイルも Git にコミットすべきか」
について詳しく教えてください。

達成条件: lock ファイルの目的(再現性・依存の固定)が正確に説明されること

課題 11-3: 独自パッケージの依存整理

以下のプロジェクトの依存を整理させせよ:

bash
cat > ~/claude-practice/elementary/lesson11/project_b/package.json << 'EOF'
{
  "name": "project-b",
  "dependencies": {
    "axios": "^1.0.0",
    "node-fetch": "^3.0.0",
    "got": "^12.0.0",
    "superagent": "^8.0.0",
    "request": "^2.88.0"
  }
}
EOF
project_b/package.json を読んでください。
HTTPクライアントライブラリが5つも入っています。
現代的なNode.jsプロジェクトでのベストプラクティスを踏まえて、
1つに統一する提案をしてください。
理由とマイグレーションの難易度も含めて。

達成条件: 適切な理由付きで1つのHTTPクライアントへの統一案が提示されること


自己チェックリスト


次の型

Lesson 12: 初級クラス総合演習 →

Claude Code Dojo