1. 概念介紹

包是什么？

『包』英文單詞是package,代表了一組特定功能的源碼集合

包管理工具

管理『包』的應(yīng)用軟件，可以對「包」進行下載安裝，更新，刪除，上傳等操作
借助包管理工具，可以快速開發(fā)項目，提升開發(fā)效率
包管理工具是一個通用的概念，很多編程語言都有包管理工具，所以掌握好包管理工具非常重要

常用的包管理工具

• npm
• yarn
• cnpm

2. npm

2.1 npm 下載

npm全稱Node Package Manager,翻譯為中文意思是『Node的包管理工具』
npm是node.js官方內(nèi)置的包管理工具，是必須要掌握住的工具

2.2 npm 初始化包

npm init命令的作用是將文件夾初始化為一個『包』，交互式創(chuàng)建package.json文件package.json是包的配置文件，每個包都必須要有package.json

package.json 內(nèi)容示例：

{
  "name": "test",
  "version": "1.0.0",
  "description": "學(xué)習(xí)npm",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC"
}

初始化注意事項：

• package name(包名)不能使用中文、大寫，默認值是文件夾的名稱，所以文件夾名稱也不能使用中文和大寫
• version(版本號)要求x.x.x的形式定義，x 必須是數(shù)字，默認值是1.0.0
• ISC證書與MT證書功能上是相同的，關(guān)于開源證書擴展閱讀
• package.json可以手動創(chuàng)建與修改
• 使用npm init -y或者npm init --yes極速創(chuàng)建package.json(文件夾名稱不包含大寫字母和漢字)

2.3 npm 包

(1) npm 搜索包

• 命令行[ npm s(/search) 關(guān)鍵字]
• 網(wǎng)站搜索https://www.npmjs.com/

對于如何精準找到需要的包，這就需要我們長期學(xué)習(xí)，通過文章、項目去積累

(2) npm 下載安裝包

我們可以通過npm install和npm i命令安裝包
要確保是在聯(lián)網(wǎng)狀態(tài)下

#格式
npm install <包名>
npm i <包名>

#示例 比如我們要使用uniq 這個包給數(shù)組去重
npm install uniq
npm i uniq

運行之后文件夾下會增加兩個資源

• node_modules文件夾存放下載的包
• package-lock.json包的鎖文件，用來鎖定包的版本

如果出現(xiàn)錯誤，可以試試給node.js 配置一下環(huán)境變量。

const uniq = require('uniq')
const array = [1, 2, 3, 4, 5, 6, 2, 3, 4, 5, 2]

const result = uniq(array)

console.log(result)

// [ 1, 2, 3, 4, 5, 6 ]

安裝uniq 之后，uniq 就是當前這個包的一個依賴包，有時會簡稱為依賴比如我們創(chuàng)建一個包名字為A,A中安裝了包名字是B,我們就說B是A的一個依賴包，也會說A依賴B

(3) require 導(dǎo)入npm 包的基本流程

require 導(dǎo)入模塊的類型有三種：

• 內(nèi)置模塊
• 自定義模塊
• npm 包

require 導(dǎo)入npm 包的基本流程：

• 在當前文件夾下node_modules中尋找同名的文件夾
• 在上級目錄中下的node_modules中尋找同名的文件夾，直至找到磁盤根目錄

const uniq = require('uniq');
const uniq = require('./node_modules/uniq');
const uniq = require('./node_modules/uniq/uniq.js');

其實怕我們導(dǎo)入npm 包有以上三種方式，但是下面兩種方式的導(dǎo)入位置都太絕對了，一旦更換了node_modules 文件夾的位置就會出錯；所以一般我們會使用第一種導(dǎo)入方式。

2.4 開發(fā)依賴和生產(chǎn)依賴

首先來了解一下生產(chǎn)環(huán)境和開發(fā)環(huán)境！

開發(fā)環(huán)境是程序員專門用來寫代碼的環(huán)境，一般是指程序員的電腦，開發(fā)環(huán)境的項目一般只能程序員自己訪問生產(chǎn)環(huán)境是項目代碼正式運行的環(huán)境，一般是指正式的服務(wù)器電腦，生產(chǎn)環(huán)境的項目一般每個客戶都可以訪問

我們可以在安裝時設(shè)置選項來區(qū)分依賴的類型，目前分為兩類：

舉個例子方便大家理解，比如說做蛋炒飯需要大米，油，蔥，雞蛋，鍋，煤氣，鏟子等
其中鍋，煤氣，鏟子屬于開發(fā)依賴，只在制作階段使用
而大米，油，蔥，雞蛋屬于生產(chǎn)依賴，在制作與最終食用都會用到
所以開發(fā)依賴是只在開發(fā)階段使用的依賴包，而生產(chǎn)依賴是開發(fā)階段和最終上線運行階段都用到的依賴包

2.5 npm 全局安裝

之前我們使用npm 包安裝方式都是局部安裝，也就是出了某個文件夾就沒辦法使用了；現(xiàn)在我們來學(xué)習(xí)一下npm 的全局安裝。

npm i -g nodemon

全局安裝完成之后就可以在命令行的任何位置運行nodemon 命令

該命令的作用是自動重啟node應(yīng)用程序也就是不像以前一樣修改文件后先暫停上次請求再重新啟動文件了；有了這個包后，只要保存了文件再次刷新網(wǎng)頁，網(wǎng)頁內(nèi)容就會更新了。

說明：

• 全局安裝的命令不受工作目錄位置影響
• 可以通過npm root -g可以查看全局安裝包的位置
• 不是所有的包都適合全局安裝，只有全局類的工具才適合，可以通過查看包的官方文檔來確定安裝方式，這里先不必太糾結(jié)

(1) 修改windows 執(zhí)行策略

有些電腦在安裝nodemon 包是可能會出現(xiàn)問題，可能是windows 默認不允許npm 全局執(zhí)行腳本文件，所以需要修改執(zhí)行策略。

(2) 環(huán)境變量Path

命令行根目錄下如果有xxx.exe / xxx.cmd 的文件在，程序就會去執(zhí)行文件;
我們?nèi)绻渲媚硞€程序的環(huán)境變量，那么就可以在命令行窗口直接輸入程序名就可以打開程序。

如果遇到想要在命令行的任何位置都可以打開某個程序就可以為之配置環(huán)境變量。

2.6 安裝包依賴

在項目協(xié)作中有一個常用的命令就是npm i,通過該命令可以依據(jù)package.json和package-lock.json的依賴聲明安裝項目依賴

npm i
npm install

node_modules文件夾大多數(shù)情況都不會存入版本/倉庫

在下載別人的代碼的時候文件夾中一般都是沒有node_modules 文件夾的，這樣我們的代碼可能就沒有辦法運行，如果我們一個一個的安裝依賴效率很低,所以就可以使用npm i 安裝依賴，就可以啟動項目了。

2.7 安裝指定版本的包

項目中可能會遇到版本不匹配的情況，有時就需要安裝指定版本的包，可以使用下面的命令的

##格式
npm i <包名@版本號>
##示例
npm i jquery@1.11.2

2.8 刪除依賴

項目中可能需要刪除某些不需要的包，可以使用下面的命令

##局部刪除
npm remove uniq
npm r uniq
##全局刪除
npm remove -g nodemon

2.9 配置命令別名

通過配置命令別名可以更簡單的執(zhí)行命令！

配置package,json中的scripts屬性

{
.
.
.
“scripts”:{
“server”:“node server.js”,
“start”:“node index.js”,
}
.
.
.
}

配置完成之后，可以使用別名執(zhí)行命令

npm run server
npm run start

不過start別名比較特別，使用時可以省略run

npm start

補充說明：
npm start是項目中常用的一個命令，一般用來啟動項目
npm run有自動向上級目錄查找的特性，跟require函數(shù)也一樣
對于陌生的項目，我們可以通過查看scripts屬性來參考項目的一些操作

3. cnpm

3.1 cnpm 介紹與安裝

cnpm是一個淘寶構(gòu)建的npmjs.com的完整鏡像，也稱為 淘寶鏡像 ，網(wǎng)址https://npmmirror…com/cnpm服務(wù)部署在國內(nèi)阿里云服務(wù)器上，可以提高包的下載速度
官方也提供了一個全局工具包cnpm,操作命令與npm大體相同

我們可以通過npm來安裝cnpm工具

npm install -g cnpm --registry=https://registry.npmmirror.com

3.2 操作命令

基本使用與npm 是一樣的。

4. npm 配置淘寶鏡像

用npm 也可以使用淘寶鏡像，配置的方式有兩種

• 直接配置
• 工具配置

4.1 直接配置

執(zhí)行如下命令即可完成配置

npm config set registry https://registry.npmmirror.com/

4.2 工具配置

使用nrm配置npm的鏡像地址npm registry manager決定npm 下載包的地址

安裝nrm

npm i -g nrm

修改鏡像

nrm use taobao

nrm 切換注冊地址 / 鏡像也很方便。

nrm ls

列出支持的鏡像地址

檢查是否配置成功 (選做)

npm config list

檢查registry 地址是否為https://registry.npmmirror.com/,如果是則表明成功

補充說明：
1.建議使用第二種方式進行鏡像配置，因為后續(xù)修改起來會比較方便
2.雖然cnpm可以提高速度，但是npm也可以通過淘寶鏡像進行加速，所以npm的使用率還是高于cnpm

5. yarn

5.1 介紹

yarn是由Facebook在2016年推出的新的Javascript包管理工具，官方網(wǎng)址：https:/yarnpkg.com/

5.2 特點

yarm官方宣稱的一些特點

• 速度超快：yarn 緩存了每個下載過的包，所以再次使用時無需重復(fù)下載。同時利用并行下載以最大化資源利用率，因此安裝速度更快
• 超級安全：在執(zhí)行代碼之前，yarn 會通過算法校驗每個安裝包的完整性
• 超級可靠：使用詳細、簡潔的鎖文件格式和明確的安裝算法，yarn 能夠保證在不同系統(tǒng)上無差異的工作

我們可以使用npm安裝yarn

npm i -g yarn

5.3 yarn 常用命令

5.4 yarn 配置淘寶鏡像

可以通過如下命令配置淘寶鏡像

yarn config set registry https://registry.npmmirror.com/

可以通過yarn config list查看yarm的配置項

5.5 npm 和yarn 選擇

大家可以根據(jù)不同的場景進行選擇
1.個人項目
如果是個人項目，哪個工具都可以，可以根據(jù)自己的喜好來選擇
2.公司項目
如果是公司要根據(jù)項目代碼來選擇，可以通過鎖文件判斷項目的包管理工具

• npm的鎖文件為package-lock.json
• yarm的鎖文件為yarn.lock

包管理工具不要混著用，切記，切記，切記

6. npm 發(fā)布一個包

目前了解即可，不太常用
我們可以將自己開發(fā)的工具包發(fā)布到npm服務(wù)上，方便自己和其他開發(fā)者使用，操作步驟如下：

• 創(chuàng)建文件夾，并創(chuàng)建文件index.js,在文件中聲明函數(shù)，使用module.exports暴露
• npm初始化工具包，package.json填寫包的信息（包的名字是唯一的）
• 注冊賬號 https:/www.npmjs.com/signup
• 激活賬號（一定要激活賬號）
• 修改為官方的官方鏡像（命令行中運行nrm use npm)
• 命令行下npm login填寫相關(guān)用戶信息
• 命令行下npm publish提交包

更新包：

后續(xù)可以對自己發(fā)布的包進行更新，操作步驟如下

• 更新包中的代碼
• 測試代碼是否可用
• 修改package.json中的版本號
• 發(fā)布更新

npm publish

刪除包：執(zhí)行如下命令刪除包

npm unpublish

刪除包需要滿足一定的條件，https::/docs.npmjs.com/policies/unpublish
你是包的作者
發(fā)布小于24小時
大于24小時后，沒有其他包依賴，并且每周小于300下載量，并且只有一個維護者

7. 擴展內(nèi)容

除了編程語言領(lǐng)域有包管理工具之外，操作系統(tǒng)層面也存在包管理工具，不過這個包指的是『軟件包』

8. nvm 介紹和使用

nvm全稱Node Version Manager顧名思義它是用來管理node版本的工具，方便切換不同版本的Node.js

nvm的使用非常的簡單，跟npm的使用方法類似

常用命令：

到此這篇關(guān)于Node.js包管理工具(npm、yarn、cnpm)的文章就介紹到這了,更多相關(guān)Node.js包管理工具內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！ 

最新評論