您现在的位置：程式碼之家 >> 編程語言 > >> C語言 >> C++ >> C++ 入門

深入理解 npm 中 dependencies 與 devDependencies 的差異

編輯：C++ 入門

前言

在 Node.js 專案開發中，package.json 是專案的核心設定檔。其中 dependencies 與 devDependencies 兩個欄位雖然都用於宣告套件相依性，但它們的使用時機與安裝行為有著本質區別。搞懂這兩者的差異，不僅能讓專案結構更清晰，也能優化生產環境的部署效率。

核心差異一覽

特性	dependencies	devDependencies
用途	運行時必須的套件（如 Express、React、Lodash）	僅開發/建構階段需要的套件（如 Webpack、ESLint、Jest、TypeScript）
安裝指令	`npm install <pkg> --save`（npm 5+ 預設行為）	`npm install <pkg> --save-dev`
生產環境安裝	會被安裝（`npm install --production` 仍會裝）	不會被安裝（`npm install --production` 會跳過）
傳遞性安裝	作為依賴被其他專案引用時，會一併安裝	作為依賴被其他專案引用時，不會安裝

實戰示範

建立一個測試專案並安裝套件：

mkdir test-project && cd test-project
npm init -y
npm install express --save
npm install jslint --save-dev
cat package.json

輸出的 package.json 將呈現：

{
  "name": "test-project",
  "version": "1.0.0",
  "dependencies": {
    "express": "^4.18.2"
  },
  "devDependencies": {
    "jslint": "^0.12.1"
  }
}

為什麼要區分？

1. 減輕生產環境負擔

生產環境只需執行 npm install --production（或設定 NODE_ENV=production），即可自動跳過所有開發依賴，大幅減少 node_modules 體積與安裝時間。對於容器化部署（Docker）、Serverless 函數、CI/CD 流程尤為重要。

2. 避免依賴污染

當你的套件被發布到 npm 並被他人引用時，devDependencies 不會被下游專案安裝。這防止了測試框架、建構工具等開發工具鏈污染使用者的專案依賴樹。

3. 語義化專案結構

明確區分「運行時必要」與「開發輔助」，讓新加入團隊的開發者一眼就能看出專案的核心技術棧與工具鏈。

常見誤區與最佳實踐

❌ 錯誤：將 TypeScript、Babel、ESLint 放入 dependencies → 導致生產環境安裝無用套件。
❌ 錯誤：將運行時庫（如 axios、moment、react）放入 devDependencies → 導致生產環境缺少關鍵依賴而崩潰。
✅ 正確：dependencies 僅放「程式碼 require/import 且上線必須」的套件；其餘統統進 devDependencies。
✅ 正確：若某套件既用於建構（如 webpack），又在運行時被動態 require（極少見），則放入 dependencies。

進階：peerDependencies 與 optionalDependencies

除了上述兩者，還有兩個相關欄位：

peerDependencies：聲明「宿主環境必須已安裝的套件及版本範圍」，常見於插件開發（如 React 插件需聲明 "peerDependencies": { "react": "^18.0.0" }）。npm 7+ 會自動安裝，舊版本會警告。
optionalDependencies：安裝失敗不會導致 npm install 失敗，適用於可選的原生模組（如 fsevents 僅 macOS 需要）。