1. 程式人生 > >npm install 你很明白嗎

npm install 你很明白嗎


【當我們敲 npm install 的時候會安裝哪些依賴,dependencies 和 devDependencies 都會安裝嗎?還是隻安裝 dependencies ?】

【專案依賴包是放在 dependencies 和 devDependencies ?】

簡單問兩個問題,勾起大家對 npm install,dependencies ,devDependencies 的回憶。

下面進入正文

  • npm install 也支援直接輸入 Github 程式碼庫地址
$ npm install git://github.com/package/path.git
$ npm install git://github.com/package/path.git#0.1.0

安裝之前,npm install 會先檢查,node_modules 目錄之中是否已經存在指定模組。如果存在,就不再重新安裝了,即使遠端倉庫已經有了一個新版本,也是如此。

如果你希望,一個模組不管是否安裝過, npm 都要強制重新安裝,可以使用 -f--force 引數。

$ npm install <packageName> --force

npm install 的時候會安裝哪個裡面的依賴?dependencies 還是 devDependencies

npm install 預設會安裝 dependencies 欄位和 devDependencies 欄位中的所有模組】。 如果軟體包具有 package-lock 或 shrinkwrap 檔案,則依賴項的安裝將由此驅動,如果兩個檔案都存在,則 npm-shrinkwrap.json 優先。 請參閱

package-lock.jsonnpm-shrinkwrap

【ok,那麼也就是說,當我們在拿到一個專案的時候,使用 npm install 是會安裝 dependencies 和 devDependencies 裡所有的依賴包的。】

那麼是否意味著,我們在安裝依賴包的時候,不需要過多的去糾結是使用 -S 還是 -D 呢 ?隨便安裝到 dependencies 或者 devDependencies 裡都行,反正 npm install 的時候,都會安裝 dependencies 和 devDependencies 裡面的依賴。

其實不然!

如果使用 --production 引數,可以只安裝 dependencies 欄位的模組。

$ npm install --production
# 或者
$ NODE_ENV=production npm install

【所以,我們做好 dependencies 和 devDependencies 的區分的話,在使用 npm install --production 的時候,還是有區別的。】

不過,感覺這個 npm install --production 的使用場景不是很多。我好像沒怎麼用,可能以後會用到吧。

內心os:既然 npm install --production 我用不到,那我在安裝依賴包的時候,還是隨意吧,放到 dependencies 或者 devDependencies 都無所謂,反正 npm install 的時候會把 dependencies 和 devDependencies 裡面的依賴包都安裝下來。哈哈~~,隨意使用 -S 或者 -D 咯~

錯!
錯!!
錯!!!
這樣想就錯了。dependencies 和 devDependencies 還是有明顯區別的。我們接著來看。

我們在安裝依賴包的時候,要如何區分是安裝到 dependencies 還是 devDependencies 中呢?

dependencies 依賴

這個可以說是我們 npm 核心一項內容,依賴管理,這個物件裡面的內容就是我們這個專案所依賴的 js 模組包。下面這段程式碼表示我們依賴了 markdown-it 這個包,版本是 ^8.1.0 ,代表最小依賴版本是 8.1.0 ,如果這個包有更新,那麼當我們使用 npm install 命令的時候,npm 會幫我們下載最新的包。當別人引用我們這個包的時候,包內的依賴包也會被下載下來。

"dependencies": {
    "markdown-it": "^8.1.0"
}

devDependencies 開發依賴

【在我們開發的時候會用到的一些包,只是在開發環境中需要用到,但是在別人引用我們包的時候,不會用到這些內容,放在 devDependencies 的包,在別人引用的時候不會被 npm 下載】。

"devDependencies": {
    "autoprefixer": "^6.4.0",0",
    "babel-preset-es2015": "^6.0.0",
    "babel-preset-stage-2": "^6.0.0",
    "babel-register": "^6.0.0",
    "webpack": "^1.13.2",
    "webpack-dev-middleware": "^1.8.3",
    "webpack-hot-middleware": "^2.12.2",
    "webpack-merge": "^0.14.1",
    "highlightjs": "^9.8.0"
}

當你有了一個完整的 package.json 檔案的時候,就可以讓人一眼看出來,這個模組的基本資訊,和這個模組所需要依賴的包。我們可以通過 npm install 就可以很方便的下載好這個模組所需要的包。

結論:當你在開發一個 npm 包的時候,還是要好好管理你的 dependencies 依賴 和 devDependencies 依賴。 之前有個同事寫了一個 loading 元件,發到 npm 上面去了,他跟我說簡單好用,我就用了。但是我發現他這麼小的一個元件,為什麼包這麼大。一看,原來他寫這個 npm 包的時候,所有的依賴都放到 dependencies 裡面了(包括 gulp,browser-asyc,壓縮程式碼的,express…等等一些他開發時用的工具)。

你們說,他是不是挺狠的!