在通過(guò)npm安裝依賴的時(shí)候，有兩種方式：npm install XXX --save-dev（下文簡(jiǎn)稱--save-dev）與npm install XXX --save（下文簡(jiǎn)稱--save）耕蝉，它們都可以將依賴信息寫入到package.json文件內(nèi)铐刘。那他們之間有什么區(qū)別呢歧杏？下面我們進(jìn)行進(jìn)一步的分析镰惦。
區(qū)別1：通過(guò)--save-dev方法安裝的依賴，會(huì)將該依賴信息加載到package.json的"devDependencies"鍵下犬绒，而通過(guò)--save方法安裝的依賴則會(huì)將信息加載到pacage.json的"dependencies"鍵下旺入。package.json代碼如下：
...
"devDependencies": {?
? ? ...
?????"babel": "^6.23.0",?
? ? ?"style-loader": "^0.16.1",?
?????"vue-loader": "^11.3.4",?
?????"vue-style-loader": "^2.0.5",
? ? ...
},
"dependencies": {?
? ? ...
"vue": "^2.2.6"
...
}
...
代碼所表現(xiàn)的區(qū)別1就是：vue通過(guò)--save方式添加，babel凯力、style-loader茵瘾、vue-loader、vue-style-loader通過(guò)--save-dev方式添加咐鹤。
除了區(qū)別1外拗秘，這兩種方式還有區(qū)別2。
區(qū)別2：npm官方解釋：devDependencies是開(kāi)發(fā)（開(kāi)發(fā)環(huán)境）時(shí)的依賴祈惶，dependencies是運(yùn)行（生產(chǎn)環(huán)境）時(shí)的依賴雕旨。這就是說(shuō)，devDependencies下的依賴只是在開(kāi)發(fā)時(shí)起作用捧请，運(yùn)行時(shí)并不需要這些依賴凡涩，比如：html-webpack-plugin（生成html文件）、extract-text-webpack-plugin（提取樣式到單獨(dú)的css文件）等血久。與之對(duì)應(yīng)的突照，dependencies下的依賴不僅在開(kāi)發(fā)時(shí)需要，在發(fā)布后仍然會(huì)使用的到氧吐，比如：vue，vue-router末盔，vuex筑舅，jQuery等，如果通過(guò)--save-dev方式安裝這些依賴陨舱，那么在打包后運(yùn)行會(huì)出現(xiàn)錯(cuò)誤翠拣。
額外說(shuō)明：當(dāng)我們?cè)趃ithub上clone一個(gè)項(xiàng)目的時(shí)候，README.md通常會(huì)有安裝說(shuō)明游盲，一般的方式是通過(guò)npm install直接安裝需要的所有依賴（包括devDependencies和dependencies）误墓，之后項(xiàng)目才可以正常啟動(dòng)蛮粮。
6人點(diǎn)贊
作者：Waitingforyu
鏈接：http://www.reibang.com/p/d3300efddc5d
來(lái)源：簡(jiǎn)書(shū)
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請(qǐng)聯(lián)系作者獲得授權(quán)谜慌，非商業(yè)轉(zhuǎn)載請(qǐng)注明出處然想。
