NPM 包管理工具詳解,使用教程


NPM 包管理工具

1.1 定義:什么是 NPM

NPM 全稱 Node Package Manager,它是 JavaScript 的包管理工具, 並且是 Node.js 平台的默認包管理工具。通過NPM 可以安裝、共享、分發代碼,管理項目依賴關系。

  • 可從NPM服務器下載別人編寫的第三方包到本地使用。
  • 可從NPM服務器下載並安裝別人編寫的命令行程序到本地使用。
  • 可將自己編寫的包或命令行程序上傳到NPM服務器供別人使用。

其實我們可以把 NPM 理解為前端的 Maven。我們通過 npm 可以很方便地安裝與下載 ,管理前端工程。

最新版本的 Node.js 已經集成了 npm 工具,所以必須首先在本機安裝 Node.js

Node.js 官網下載地址:

裝完成后,查看當前 nodejs 與 npm 版本

  • 查看node.js版本:node -v
  • 查看npm版本:npm -v

 

 

1.2 NPM命令操作

1.2.1 NPM初始化

npm init 命令初始化項目:

新建一個 文件夾,通過命令提示符窗口進入到該文件夾,執行下面命令進行初始化項目

 

 

 

最后會生成package.json文件,這個是包的配置文件,相當於maven的pom.xml。可以根據需求修改。

 

1.2.2 安裝模塊

npm install 命令用於安裝某個模塊,安裝方式分為 :本地安裝(local)、全局安裝(global)兩種.

本地安裝

將 JS 庫安裝在當前執行命令時所在目錄下,安裝

 

舉例:安裝express模塊

 

如果出現黃色的是警告信息,可以忽略,請放心,你已經成功安裝了。

在該目錄下會出現一個 node_modules 文件夾 和 package-lock.json

node_modules 文件夾用於存放下載的js庫(相當於maven的本地倉庫)

package-lock.json 是在 npm install 時候生成一份文件。

用以記錄當前狀態下實際安裝的各個包的具體來源和版本號。

重新打開 package.json 文件,發現剛才下載的 jquery.js 已經添加到依賴列表中了.

 

關於模塊版本號表示方式:

指定版本號:比如 3.5.2,只安裝指定版本。遵循 “大版本.次要版本 小版本”的格式規定。

~波浪號 + 指定版本號:比如 ~3.5.2,安裝 3.5.x 的最新版本(不低於 3.5.2),但是不安裝 3.6.x,也

就是說安裝時不改變大版本號和次要版本號。

^ 插入號 + 指定版本號:比如 ^3.5.2,安裝 3.x 新版本(不低於 3.5.2),但是不安裝 4.x.x,也

就是說安裝時不改變大版本號。需要注意的是,如果 本號為0,則插入號的行為與波浪號相同,這是

因為此時處於開發階段,即使是次要版本號變動,也可能帶來 程序的不兼容。

latest:安裝最新版本。

 

 

全局安裝

將 JS 庫安裝到你的 全局目錄 下

 

使用全局安裝會將庫安裝到你的全局目錄下。

查看全局安裝目錄

如果你不知道你的全局目錄在哪里,執行命令:

 

如果安裝時出現如下錯誤:

npm err! Error: connect ECONNREFUS 27.0.0.1:8087

解決方法,執行如下命令:

npm config set proxy null

 

1.2.3 生產環境模塊

格式:

--save或 -S 參數意思是把模塊的版本信息保存 package.json 文件的 dependencies 字段中(生產環境依賴)

 

在 package.json 文件的 dependencies 字段中

 

1.2.4 生產環境模塊

格式:

--save-dev 或 -D 參數是把模塊版本信息保存到 package.json 文件的 devDep ncies 字段中(開發環境

依賴),所以開發階段一般使用它:

 

舉例:

安裝 eslint 模塊,它是語法格式校驗,只在開發環境依賴中即可

 

在 package.json 文件的 devDependencies 段中

 

1.3 批量下載模塊

我們從網上下載某些項目后,發現只有 package.json , 沒有 node_modules 文件夾,這時我們需要通過命令下載

這些js庫。

命令提示符進入 package.json 所在目錄,執行命令:

 

此時,npm 會自動下載 package.json 中依賴的js庫.

 

1.4 查看模塊命令

1.4.1查看本地已安裝模塊方式

方式1:可以安裝目錄 node_modules 下的查看包是否還存在

方式2:可以使用以下命令查看:

 

1.4.2查看模塊遠程最新版本

 

舉例:

 

1.4.3查看模塊遠程所有版本

npm view <Module Name> versions

 

舉例: 查看 jquery 模塊的所有版本

 

npm view jquery versions

1.5卸載模塊

卸載局部模塊

npm uninstall <Module Name>

 

卸載全局模塊

npm uninstall -g <Module Name>

 

1.6配置淘寶鏡像加速

1. 查看當前使用的鏡像地址

 

2. 配置淘寶鏡像地址

 

1.7安裝cnpm

1. 安裝cnpm

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

2. 使用cnpm

cnpm install xxx


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM