前端安裝依賴時，npm --save-dev 與--save 的區別

npm install 在安裝 npm 包時，有兩種命令參數可以把它們的信息寫入 package.json 文件，一個是:

npm i  <packname>(依賴包)  --save-dev

or

npm i  <packname>(依賴包)   -D

    比如工程構建（開發時、“打包”時）依賴 ；例：xxx-cli , less-loader , babel-loader...

另一個是:

npm install <packname>(依賴包) --save

or


npm install <packname>(依賴包) -S

他們表面上的區別是--save 會把依賴包名稱添加到 package.json 文件 dependencies 鍵下，--save-dev 則添加到 package.json 文件 devDependencies 鍵下，譬如：

{
 "dependencies": {
    "vue": "^2.2.1"
  },
  "devDependencies": {
    "babel-core": "^6.0.0",
    "babel-loader": "^6.0.0",
    "babel-preset-latest": "^6.0.0",
    "cross-env": "^3.0.0",
    "css-loader": "^0.25.0",
    "file-loader": "^0.9.0",
    "vue-loader": "^11.1.4",
    "vue-template-compiler": "^2.2.1",
    "webpack": "^2.2.0",
    "webpack-dev-server": "^2.2.0"
  }
}

不過這只是它們的表面區別。它們真正的區別是，npm自己的文檔說dependencies是運行時依賴，devDependencies是開發時的依賴。即devDependencies 下列出的模塊，是我們開發時用的，比如:

工程構建（開發時、“打包”時）依賴 ；例：xxx-cli , less-loader , uglifyjs-webpack-plugin,gulp-uglify,babel-loader...

我們安裝 js的壓縮包gulp-uglify 時，我們採用的是 “npm install –save-dev gulp-uglify ”命令安裝，因爲我們在發佈後用不到它，而只是在我們開發纔用到它。

dependencies 下的模塊，則是我們發佈後還需要依賴的模塊，譬如像jQuery庫或者Angular框架類似的，我們在開發完後後肯定還要依賴它們，否則就運行不了,比如：

  項目（運行時、發佈到生產環境時）依賴；例：antd , element,react...

另外需要補充的是：
正常使用npm install時，會下載dependencies和devDependencies中的模塊，當使用npm install –production或者註明NODE_ENV變量值爲production時，只會下載dependencies中的模塊。