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"
}
}
EOFbash
claudepackage.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"
}
}
EOFproject_b/package.json を読んでください。
HTTPクライアントライブラリが5つも入っています。
現代的なNode.jsプロジェクトでのベストプラクティスを踏まえて、
1つに統一する提案をしてください。
理由とマイグレーションの難易度も含めて。達成条件: 適切な理由付きで1つのHTTPクライアントへの統一案が提示されること
