什么叫npm

npm是nodejs的包管理工具，在現(xiàn)如今產(chǎn)品化前端工程師全過(guò)程中，npm包起著至關(guān)重要的功效。

安裝npm

做為nodejs的包管理工具，npm伴隨著nodejs一起安裝的。一般狀況下，在我們安裝進(jìn)行nodejs之后，npm也就隨著安裝了。

假如要更新npm，能夠采用以下指令：

npm install npm -g

npm鏡像

npm給予了官方網(wǎng)的鏡像系統(tǒng)管理倉(cāng)庫(kù): 官方網(wǎng)庫(kù)房，假如我們要應(yīng)用某一元件庫(kù)，能夠 在這個(gè)平臺(tái)里面開(kāi)展搜索，隨后應(yīng)用npm開(kāi)展安裝。

因?yàn)橹袊?guó)的網(wǎng)絡(luò)空間，一般 人們會(huì)設(shè)定淘寶網(wǎng)的鏡像系統(tǒng)，設(shè)定方式 ：

npm config set registry https://registry.npm.taobao.org

要查詢?cè)O(shè)定了什么主要參數(shù)，應(yīng)用指令：

npm config ls

從這當(dāng)中還可以見(jiàn)到環(huán)境變量的詳細(xì)地址：C:\Users\Administrator\.npmrc

應(yīng)用npm安裝包

復(fù)位環(huán)境變量

在應(yīng)用npm以前，要先復(fù)位npm的環(huán)境變量，應(yīng)用以下指令：

npm init

這個(gè)時(shí)候會(huì)發(fā)生一個(gè)復(fù)位的正確引導(dǎo)cmd，使你鍵入項(xiàng)目規(guī)劃、版本信息、創(chuàng)作者、協(xié)議書(shū)等，如果你覺(jué)得這種鍵入起來(lái)不便，能夠 加上主要參數(shù)來(lái)應(yīng)用初始值：

npm init --yes

應(yīng)用之上指令，會(huì)在文件列表轉(zhuǎn)化成package.json。下邊是這一默認(rèn)設(shè)置 環(huán)境變量的注解：

{
  "name": "demo1",      //名字
  "version": "1.0.0",   //版本信息
  "description": "",    //敘述
  "main": "index.js",   //通道文檔
  "scripts": {          //腳本制作，key-value文件格式，能夠應(yīng)用 npm run xxx
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "keywords": [],       //關(guān)鍵詞
  "author": "",         //創(chuàng)作者
  "license": "ISC"      //協(xié)議書(shū)
}

包版本信息

npm包的版本號(hào)取名文件格式為: major.minor.patch

• major: 主版本信息，新的架構(gòu)調(diào)整，兼容問(wèn)題老版本

• minor: 次版本信息，增加作用，兼容老版本

• patch: 修復(fù)版本信息，修補(bǔ)bug，兼容老版本

在我們安裝一個(gè)包以后，能夠 見(jiàn)到包名的前邊有一些標(biāo)記，比如 ^、~等，這種標(biāo)記決策了當(dāng)今新項(xiàng)目依靠的包的版本信息如何選擇

• 沒(méi)有標(biāo)記，比如1.2.5，表明務(wù)必依靠1.2.5版

• ~：大約配對(duì)某一版本號(hào)，假如minor版本信息特定了，那麼minor版本信息不會(huì)改變，而patch版本號(hào)隨意，假如minor和patch版本號(hào)未找到，那麼minor和patch版本號(hào)隨意。

比如：

如：~1.1.2，表明>=1.1.2 <1.2.0，能夠 是1.1.2，1.1.3，1.1.4，.....，1.1.n 
如：~1.1，表明>=1.1.0 <1.2.0，能夠是跟上面一樣
如：~1，表明>=1.0.0 <2.0.0，能夠 是1.0.0，1.0.1，1.0.2，.....，1.0.n，1.1.n，1.2.n，.....，1.n.n

• ^：兼容某一版本號(hào)，版本信息中最左側(cè)的非0數(shù)據(jù)的右邊能夠 隨意，假如缺乏某一版本信息，則這一版本信息的部位能夠隨意
  比如：

如：^1.1.2 ，表明>=1.1.2 <2.0.0，能夠是1.1.2，1.1.3，.....，1.1.n，1.2.n，.....，1.n.n
如：^0.2.3 ，表明>=0.2.3 <0.3.0，能夠是0.2.3，0.2.4，.....，0.2.n
如：^0.0，表明 >=0.0.0 <0.1.0，能夠是0.0.0，0.0.1，.....，0.0.n

其他的一些書(shū)寫(xiě)：

• >：務(wù)必超過(guò)某一版本號(hào)，如：>1.1.2，表明務(wù)必超過(guò)1.1.2版

• >=：可大于或等于某一版本號(hào)，如：>=1.1.2，表明能夠 相當(dāng)于1.1.2，還可以超過(guò)1.1.2版本號(hào)

• <：務(wù)必低于某一版本號(hào) ，如：<1.1.2，表明務(wù)必低于1.1.2版本號(hào)

• <=：能夠 小于或等于某一版本號(hào)，如：<=1.1.2，表明能夠 相當(dāng)于1.1.2，還可以低于1.1.2版本號(hào)

• x-range：x的地方表明隨意版本號(hào)，如：1.2.x，表明能夠 1.2.0，1.2.1，.....，1.2.n

• *-range：隨意版本號(hào)，""也表明隨意版本號(hào)，如：*，表明>=0.0.0的隨意版本號(hào)

• version1 - version2：高于或等于version1，不大于version2，如：1.1.2 - 1.3.1，表明包含1.1.2和1.3.1及其她們件的隨意版本號(hào)

• range1 || range2：達(dá)到range1或是達(dá)到range2，能夠 好幾個(gè)范疇，如：<1.0.0 || >=2.3.1 <2.4.5 || >=2.5.2 ??.0.0，表明達(dá)到這3個(gè)范疇的版本號(hào)都能夠

scripts

scripts連接點(diǎn)下配備的是能夠 運(yùn)作的腳本制作。比如在默認(rèn)設(shè)置 配備中的test腳本制作，我們可以借助下邊的指令來(lái)啟用：

npm run test

假如我們要加上其他腳本制作，能夠在scripts連接點(diǎn)加上鍵值對(duì)：

"scripts": {          //腳本制作，key-value文件格式，能夠應(yīng)用 npm run xxx
    "test": "echo \"Error: no test specified\" && exit 1",
    "dir": "dir"    //Windows下表明文件列表文檔目錄
}

隨后應(yīng)用npm來(lái)運(yùn)作該腳本制作：

npm run dir

這兒就是為了更好地演試scripts腳本制作的使用方法，它的效果是為了能緩解我們?cè)谘邪l(fā)時(shí)的相同工作中。再舉個(gè)事例，比如應(yīng)用webpack裝包，能夠應(yīng)用指令npx webpack --mode=production，如果我們每一次都應(yīng)用詳細(xì)的指令，會(huì)變得很繁雜，這時(shí)我們可以界定一個(gè)腳本制作來(lái)簡(jiǎn)單化實(shí)際操作：

"scripts": {          //腳本制作，key-value文件格式，能夠應(yīng)用 npm run xxx
    "test": "echo \"Error: no test specified\" && exit 1",
    "dir": "dir",    //windows下表明文件列表文檔目錄
    "build": "npx webpack --mode=production"
}

在大家研發(fā)的情況下，立即應(yīng)用npm run build指令就可以。

dependencies 和 devDependencies

說(shuō)白了，dependencies 是依靠的包，devDependencies 是研發(fā)時(shí)依靠的包。比如大家工程中采用了jQuery，很顯而易見(jiàn)這也是新項(xiàng)目運(yùn)作時(shí)必須的，那麼在加上包時(shí)，應(yīng)用以下指令完成安裝：

npm install jquery

而針對(duì)webpack等在開(kāi)發(fā)設(shè)計(jì)時(shí)要于搭建工程的包，大家僅在研發(fā)時(shí)使用，新項(xiàng)目運(yùn)作時(shí)不可能應(yīng)用，因而必須把他們加上到開(kāi)發(fā)設(shè)計(jì)依靠中，加上方式 以下：

npm install webpack --save-dev

# --save-dev 能夠 縮寫(xiě)為 -D，簡(jiǎn)單化后的指令以下：
npm install webpack -D

package.lock.json

我們?cè)诎惭b文件時(shí)，能夠 見(jiàn)到它的版本號(hào)依靠，默認(rèn)設(shè)置 是兼容大版本號(hào)就可以。這時(shí)會(huì)發(fā)生一個(gè)難題，便是在不一樣的客戶計(jì)算機(jī)中，復(fù)位的包的新版本有可能會(huì)發(fā)生不一樣的狀況，進(jìn)而導(dǎo)致未可知的bug。為了更好地徹底解決這個(gè)問(wèn)題（這也是yarn問(wèn)世的一個(gè)緣故），npm在5.0以后引進(jìn)了package.lock.json文檔，用于固定不動(dòng)包的版本號(hào)、包的服務(wù)器ip等信息內(nèi)容，確保在不一樣的客戶開(kāi)發(fā)工具中載入的是一致的包。

當(dāng)客戶應(yīng)用npm install指令來(lái)安裝大家的依靠項(xiàng)時(shí)，會(huì)從package.lock.json文檔中實(shí)現(xiàn)安裝。官方網(wǎng)文本文檔：package.lock.json

安裝文件

在我們從他人的源碼復(fù)位安裝全部依靠的包時(shí)，應(yīng)用以下指令：

npm install

在我們?yōu)楣こ碳由闲碌陌鼤r(shí)，應(yīng)用以下指令：

# 安裝文件
npm install webpack --save

# 上邊指令的主要參數(shù) --save 為默認(rèn)設(shè)置 選擇項(xiàng)，能夠 忽視，因而能夠簡(jiǎn)單化為：
npm install webpack

# 全局性安裝
npm install webpack -g

# 安裝到開(kāi)發(fā)設(shè)計(jì)依靠
npm install webpack -g --save-dev

# 上邊這行指令還能夠縮寫(xiě)為下邊這一行
npm i webpackage -g -D

安裝特殊版本號(hào)的包：

npm install webpack@5.50.0

從特定的源安裝文件：

npm install -g cnpm --registry=https://registry.npm.taobao.org