# npm i と npm ci の違いと使い分け

npm install（npm i）とnpm ciの使い分けメモ。適切に使い分けることで、開発効率を向上させ、本番環境での予期しない問題を防げる。

# npm install (npm i) とは

npm install（短縮形：npm i）は、npmパッケージをインストールする最も一般的なコマンド。柔軟性が高く、開発環境で頻繁に使用する。

# npm install の特徴

# package-lock.json を更新する

npm installを実行すると、package-lock.jsonが存在する場合でも、依存関係の解決結果に応じて更新される可能性がある。

# package-lock.jsonが更新される可能性がある
npm install express@latest

# 柔軟な依存関係解決

package.jsonのバージョン範囲（^、~など）に基づいて、利用可能な最新バージョンがインストールされる。

{
  "dependencies": {
    "express": "^4.18.0"  // 4.18.0以上、5.0.0未満の最新版がインストールされる
  }
}

# node_modules の既存構造を保持

既存のnode_modulesディレクトリがある場合、可能な限り既存の構造を保持しながらインストールする。

# 開発時の利便性

新しいパッケージを追加したり、バージョンを更新したりする際に便利。

# npm ci とは

npm ci（Clean Install）は、CI/CD環境や本番環境での使用を想定した、より厳密で高速なインストールコマンド。package-lock.jsonに完全に従ってインストールを行う。

# npm ci の特徴

# package-lock.json が必須

npm ciはpackage-lock.jsonが存在しない場合、エラーで終了する。

# package-lock.jsonがない場合
npm ci
# エラー: npm ci can only install packages when your package.json and package-lock.json are in sync

# package-lock.json を更新しない

npm ciはpackage-lock.jsonを読み取り専用として扱い、一切更新しない。

# node_modules を完全に削除して再構築

既存のnode_modulesディレクトリを完全に削除してから、一から再構築する。これにより、一貫性の高いインストールが保証される。

# npm ciの実行イメージ
# 1. node_modulesを削除
# 2. package-lock.jsonに基づいて一からインストール
# 3. 厳密にバージョンをチェック

# 厳密なバージョンチェック

package.jsonとpackage-lock.jsonの内容が一致しない場合、エラーで終了する。

# package.jsonとpackage-lock.jsonが不一致の場合
npm ci
# エラー: The package-lock.json file needs to be updated

# 高速なインストール

node_modulesを削除して再構築するため、キャッシュの不整合による問題を防ぎ、高速にインストールできる。

# npm i と npm ci の比較

項目	npm install (npm i)	npm ci
package-lock.json	更新される可能性がある	必須、更新しない
node_modules	既存構造を保持	完全削除して再構築
速度	やや遅い（差分更新）	高速（一から構築）
厳密性	柔軟（バージョン範囲を許容）	厳密（完全一致を要求）
エラーハンドリング	警告のみで続行	エラーで終了
使用場面	開発環境	CI/CD、本番環境
package.json不一致	警告のみ	エラーで終了

# 使い分けのガイドライン

# 開発環境では npm install を使用

開発中は、新しいパッケージを追加したり、バージョンを更新したりする必要があるため、npm installを使用する。

# CI/CDや本番環境では npm ci を使用

CI/CDパイプラインや本番環境では、再現性と一貫性が重要。npm ciを使用することで、常に同じバージョンのパッケージがインストールされる。

# チーム開発での推奨事項

package-lock.jsonをGitにコミットする
- チーム全体で同じバージョンのパッケージを使用するため
- package-lock.jsonは必ずバージョン管理に含める
開発者はnpm installを使用
- 新しいパッケージを追加する際
- パッケージを更新する際
CI/CDではnpm ciを使用
- 自動テストやデプロイ時に使用
- 一貫性を保証するため

# package.json と package-lock.json の関係

# package.json

package.jsonは、プロジェクトの依存関係を範囲指定で定義する。

{
  "name": "my-project",
  "version": "1.0.0",
  "dependencies": {
    "express": "^4.18.0",
    "axios": "~1.4.0"
  }
}

^4.18.0: 4.18.0以上、5.0.0未満の最新版
~1.4.0: 1.4.0以上、1.5.0未満の最新版

# package-lock.json

package-lock.jsonは、実際にインストールされた正確なバージョンを記録する。

{
  "name": "my-project",
  "version": "1.0.0",
  "lockfileVersion": 3,
  "dependencies": {
    "express": {
      "version": "4.18.2",
      "resolved": "https://registry.npmjs.org/express/-/express-4.18.2.tgz",
      "integrity": "sha512-5/PsL6iGPdfQ/lKM1UuielYgv3BUoJfzXaUoxih0..."
    }
  }
}

# 両者の関係

package.json: 「どのパッケージが必要か」を定義（範囲指定）
package-lock.json: 「実際にインストールされたバージョン」を記録（固定）

npm installはpackage.jsonの範囲内で最新版を選び、package-lock.jsonを更新する。
npm ciはpackage-lock.jsonに記録された正確なバージョンをインストールする。

# よくあるエラーと対処法

# npm ci でエラーが発生する

エラー: npm ci can only install packages when your package.json and package-lock.json are in sync

原因: package.jsonとpackage-lock.jsonの内容が一致していない

対処:

# 開発環境でpackage-lock.jsonを再生成
rm package-lock.json
npm install

# 変更をコミット
git add package-lock.json
git commit -m "Update package-lock.json"

# package-lock.json が存在しない

エラー: npm ci can only install packages with an existing package-lock.json

原因: package-lock.jsonがGitにコミットされていない、または削除された

対処:

# package-lock.jsonを生成
npm install

# package-lock.jsonをGitに追加
git add package-lock.json
git commit -m "Add package-lock.json"

# 異なる環境で異なるバージョンがインストールされる

原因: package-lock.jsonが更新されていない、またはGitにコミットされていない

対処:

# 開発環境でpackage-lock.jsonを更新
npm install

# 必ずpackage-lock.jsonをGitにコミット
git add package-lock.json
git commit -m "Update package-lock.json"

# npm install が遅い

原因: キャッシュの問題や、不要なパッケージがインストールされている

対処:

# npmキャッシュをクリア
npm cache clean --force

# node_modulesを削除して再インストール
rm -rf node_modules
npm install

# または、npm ciを使用（より高速）
npm ci

# 本番環境で開発依存関係がインストールされる

原因: npm installを使用している

対処:

# 本番環境ではnpm ci --productionを使用
npm ci --production

# これにより、devDependenciesがインストールされない

# 実装時の注意点

# package-lock.json を必ずGitにコミット

package-lock.jsonは必ずバージョン管理に含め、.gitignoreに追加しない。これにより、チーム全体で同じバージョンのパッケージを使用できる。

# チーム開発でのルール

開発者: npm installを使用してパッケージを追加・更新
CI/CD: npm ciを使用して依存関係をインストール
本番環境: npm ci --productionを使用

# 定期的な依存関係の更新

定期的に依存関係を確認し、セキュリティ脆弱性をチェックして修正する。

# バージョン管理の一貫性

package-lock.jsonを更新したら必ずコミットし、プルリクエスト前にnpm ciで動作確認を行う。

# 参考リンク

2026-01-06 10日前

javascript npm nodejs

同じタグを持つ記事をピックアップしました。

# npm i と npm ci の違いと使い分け

# npm install (npm i) とは

# npm install の特徴

# package-lock.json を更新する

# 柔軟な依存関係解決

# node_modules の既存構造を保持

# 開発時の利便性

# npm ci とは

# npm ci の特徴

# package-lock.json が必須

# package-lock.json を更新しない

# node_modules を完全に削除して再構築

# 厳密なバージョンチェック

# 高速なインストール

# npm i と npm ci の比較

# 使い分けのガイドライン

# 開発環境では npm install を使用

# CI/CDや本番環境では npm ci を使用

# チーム開発での推奨事項

# package.json と package-lock.json の関係

# package.json

# package-lock.json

# 両者の関係

# よくあるエラーと対処法

# npm ci でエラーが発生する

# package-lock.json が存在しない

# 異なる環境で異なるバージョンがインストールされる

# npm install が遅い

# 本番環境で開発依存関係がインストールされる

# 実装時の注意点

# package-lock.json を必ずGitにコミット

# チーム開発でのルール

# 定期的な依存関係の更新

# バージョン管理の一貫性

# 参考リンク

関連記事

JavaScript ライブラリ aos.js 使ってスクロール連動アニメーション

Nuxt.js と Ant Design Vue 2 テーマカスタマイズ

Javascript 非同期処理 async と await のメモ

LaravelとNext.jsでBlobファイルの作成と取扱い

大きいファイルをスライス分割してアップロード

bootstrap vuejs 使って generate する際に babel が icons ファイル max 500KB エラー

Cookie localStorage sessionStorage の違い

javascript 日本語 shift-js 対応 CSV ダウンロード

javascript 楽しく遊ぼう!メッセージつぶやくウシ cowsay

Javascript DataTables で excel 風 table 作る

もっと Docker 使おうよ！Node.js を Docker から引っ張ろうよ

国際化 i18n と地域化 L10N

javascript 配列 重複排除

javascript 文字列と配列検索 indexOf findIndex find some includes 関数の違い

DeprecationWarning: Passing invalid argument types to fs.existsSync is deprecated

Jest を使った JavaScript テストの書き方

Jsconfig と Tsconfig

ブラウザーで動く javascript のクッキー操作ライブラリ js-cookie

キーコード取得 ＆ キーコード一覧

ReferenceError: location is not defined

moment.js 使って日本語曜日対応

nodejs 使う時のエラーたち

自分がよく使う npm package

Nuxtjs 動的なルーティング静的ページ自動生成

javascript password generator ランダム文字列パスワード作成

javascript で作る html から PDF 変換 pdfmake の日本語対応

vuejs で omisejapan の決済フォーム作成した時のメモ

Javascript 電話番号フォーマット

react 強制的にレンダリングする方法

正規表現一覧 よく使う検索・置換のパターン

javascript reduce 連想配列の合計計算覚えよう

Supabase CLIの使い方

javascript 指定場所にスムーズにスクロールする方法

Supabaseの使い方

Sweet Alert swal に複数 content

javascript 開発で出会った TypeError

Ubuntu に nodebrew をインストールする方法

vuejs back to top button component 作成

Javascript vuejs の validation 正規表現でフォームチェック作ったときのメモ

Javascript var let const 変数宣言の違い

VuePress SEO改善ガイド

nuxtjs と codeigniter で jwt システム構築

開発におけるコーディングルール・規約

開発時によく使うゼロ埋めパディング作業まとめ

javascript 配列重複排除

キーコード取得＆キーコード一覧

正規表現一覧よく使う検索・置換のパターン

javascript 　指定場所にスムーズにスクロールする方法