你可能不知道的 npm 實用技巧

大家好，我是 CUGGZ。

今天來分享一些實用的 npm 技巧！

1. npm 基本概念

npm 全稱爲 Node Package Manager，是一個基於 Node.js 的包管理器，也是 Node.js 社區最流行、支持的第三方模塊最多的包管理器。它的初衷就是讓開發人員更容易分享和重用代碼。npm 提供了命令行工具，其主要功能是管理 Node.js 包，包括安裝、更新、刪除、查看、搜索、發佈等。

npm 最初只是 Node.js 的包管理器，但隨着前端技術的不斷髮展，它的定位變成了廣義的包管理器，可以實現 JavaScript、React、Vue、Gulp、移動開發等包管理，是目前最大、生態最爲健全的包管理器。

npm 能解決 Node.js 在模塊管理上的很多問題，其常見的應用場景如下：

• 從 npm 鏡像服務器下載第三方模塊；

• 從 npm 鏡像服務器下載並安裝命令行程序到本地；

• 自己發佈模塊到 npm 鏡像服務器供他人使用。

npm 不需要單獨安裝，在安裝 Node.js 時，就會連帶着一起安裝 npm 了。但是安裝的 npm 不一定是最新的版本，可以使用以下命令來查看本地 npm 的版本：

npm -v

這裏的 -v 是 --version 的縮寫，表示版本。如果想升級 npm 版本，可以使用以下命令：

npm install npm@latest -g

這裏 @latest 表示最新的版本，-g 是 --global 的縮寫，表示全局安裝。

除此之外，還可以使用 help 命令來查看 npm 幫助：

npm 命令 --help

比如查看 install 的參數形式：

npm install --help

其中 --help 可以簡寫爲 - h，上面命令的執行結果如下，可以看到 install 命令的很多形式：

常見的 npm 命令：

UFCZPC

說完這些概念，下面就來看看 npm 在使用時有哪些實用的技巧。

2. 初始化 package.json

凡是使用 npm 管理的項目，都需要初始化一個 package.json 文件。

可以使用以下命令來初始化一個包：

npm init

當執行這個命令時，它會通過問答的形式來一步步進行設置。如果不需要修改默認的配置，直接一路回車即可。如果想跳過嚮導，快速生成一個 package.json 文件，可以執行以下命令：

npm init --yes

其中，--yes 可以簡寫爲 - y。這時生成的 package.json 文件的配置項就是 npm 的默認配置。當然這個默認配置也是可以更改的，可以通過類似下面這樣的形式來修改 npm 的默認配置：

npm config set init.author.name YOUR_NAME  
npm config set init.author.email YOUR_EMAIL

當執行以上命令之後，之後再執行 npm init 命令時，package.json 的作者姓名和郵箱都會初始化爲我們設定的值。

3. 快速瞭解 package.json

當要使用一個包時，如果想要了解它是如何使用的，可以使用以下命令來打開這個包的主頁，它會自動啓動瀏覽器並打開這個頁面，這裏以 React 爲例：

npm home react

如果想要查看這個包現存的 issue，或者公開的 roadmap，可以執行以下命令：

npm bugs react

如果想要查看這個包的代碼地址，可以執行以下命令：

npm repo react

如果想要查看這個包的詳細信息，可以執行以下命令：

npm info react

執行結果如下：

這裏返回的是一個 JavaScript 對象，裏面包含 react 模塊的詳細信息，可以通過 info 命令來獲取這個對象的成員信息：

npm info react description

執行結果如下：

4. 安裝依賴

可以使用 npm install 命令來安裝需要的包，如果想把這個包自動添加到 package.json 中，可以執行以下命令，這裏以安裝 React 爲例：

npm install react --save

如果想要安裝不同版本的包，可以這樣：

// 安裝最新版本
npm install react@latest
// 安裝指定版本
npm install react@16.8.0
// 安裝指定區間版本
npm install react@">=16.8.0 <17.0.1"

當使用 npm 安裝依賴時，分爲本地安裝（local）和全局安裝（global），它倆的區別就是是否包含 - g 參數：

6DxAji

可以使用 require 關鍵字來引入本地安裝的包。爲了避免引用模塊消失，保證依賴模塊都會出現在 package.json 中，最好在 npm install 時加上 --save。

需要注意，在執行 npm install 命令時，npm 5 之前只會下載，不會保存依賴信息。如果需要保存，就需要加上 --save 選項， npm 5 以後就可以省略 --save 選項了，它會自動保存。

5. 鎖定依賴

當使用 --save 來安裝依賴時，npm 會把這個依賴保存起來，並添加 ^ 前綴，他表示，當再次執行 npm install 命令時，會自動安裝這個包在此大版本下的最新版本。如果想要修改這個功能，可以執行以下命令：

npm config set save-prefix='~'

執行完該命令之後，就會把 ^ 符號改爲~ 符號。當再次安裝新模塊時，就從只允許小版本的升級變成了只允許補丁包的升級。

如果想要鎖定當前的版本，可以執行以下命令：

npm config set save-exact true

這樣每次 npm install xxx --save 時就會鎖定依賴的版本號，相當於加了 --save-exact 參數。建議線上的應用都採用這種鎖定版本號的方式。

爲了徹底的鎖定依賴的版本，讓應用在任何機器上都安裝同樣的版本，可以執行以下命令：

npm shrinkwrap

執行這個命令之後，就會在項目的根目錄產生一個 npm-shrinkwrap.json 配置文件，這裏麪包含了通過 node_modules 計算出的模塊的依賴樹及版本。只要目錄下有 npm-shrinkwrap.json 則運行 npm install 時就會優先使用 npm-shrinkwrap.json 中的配置進行安裝，沒有則使用 package.json 進行安裝。

6. 搜索依賴

npm 爲我們提供了 search 命令，用於搜索 npm 倉庫，它搜索的參數可以是一個字符串，也可以是一個正則表達式：

npm search react

搜索結果如下：

當然，我們也可以去 node.js 官網去找：https://www.npmjs.com/

想要找到一個合適的依賴包可能並不是一件容易的事。這時，可以使用網站 https://npms.io/，這裏將各個包的質量、受歡迎度、可維護性等指標做了量化。這些指標包括：是否使用了過時的依賴包、是否有代碼檢查配置、是否經過測試以及最近的版本是何時發佈的等。

推薦使用 Openbase 搜索合適的包：https://openbase.com/

7. 更新、卸載依賴

npm 爲我們提供了更新依賴版本的命令：

npm update [package name]

如果想要更新全局安裝的模塊，需要添加參數 -global：

npm update -global [package name]

當執行這兩個命令時，它會先到遠程倉庫查詢最新版本，然後查詢本地版本。如果本地版本不存在，或者遠程版本較新，就會安裝。

如果想要更新該依賴包在 package.json 中的版本，就需要使用 - S 或者 --save 參數。需要注意的是，從 npm v2.6.1 開始，npm update 只會更新頂層的模塊，而不更新依賴的依賴模塊，而之前的版本是遞歸更新的。如果想要這種效果，可以使用以下命令：

npm --depth 9999 update

除了可以更新包之外，還可以刪除指定的包：

npm uninstall [package name]

如果想要刪除全局的包，需要添加參數 -global：

npm uninstall [package name] -global

8. 查找過時的包

npm 提供了一個命令來查看過時的依賴：

npm outdated

在項目中執行該命令，輸出結果如下：

可以看到，這裏列出了過時依賴的包名稱、當前的版本、希望的版本、最新的版本、依賴在本地路徑、依賴這個包的項目名稱。

可以通過以下命令來檢查 npm 包的最新版本：

// 展示包的信息
npm view <package-name>  
npm v <package-name>
// 展示最新版本
npm v <package-name> version
// 展示所有版本
npm v <package-name> versions

9. 執行腳本

npm 不僅可以用於管理模塊，還可以用於執行腳本。在 package.json 文件中有一個 scripts 字段，可以用於定義腳本命令，功 npm 使用。我們除了可以在 package.json 文件中查看有哪些命令，也可以使用以下命令來查看所有腳本命令：

npm run

在項目中執行該命令之後的結果如下：

可以看到，這裏定義了 dev、build、build:test 等命令，如果需要執行這些命令，只要這樣執行即可：

npm run dev
npm run build

這裏不在多說，這或許是我們平時用的最多的命令了，可以根據實際開發情況，來定製自己的 npm 命令。

10. 安裝可靠的依賴

可以使用 npm ci 命令來清理、安裝依賴項。它通常用於 CI/CD 等自動化環境，使用它可以獲得可靠的依賴。

npm ci

當執行該命令時，它會先刪除本地的 node_modules 文件，因此它不需要去校驗已下載文件版本與控制版本的關係，也不用校驗是否存在最新版本的庫，所以下載的速度相比 npm install 會更快。之後它會按照 package-lock.json 文件來安裝確切版本的依賴項。並且不會將這個版本寫入 package.json 或者 package-lock.json 文件。

使用該命令時，需要注意：

• 項目必需有 package-lock.json 或 npm-shrinkwrap.json 文件，如果沒有，該命令將不起作用；

• npm ci 是 npm v6 中引入了的新命令，所以使用該命令時需要確保 npm 版本要 >=5.7；

• npm ci 不能用來安裝單個依賴，只能用來安裝整個項目的依賴；

• npm ci 會安裝 dependencies 和 devDependencies；

• 整個安裝過程不會更新 package.json 或 package-lock.json 文件，整個安裝過程是鎖死的；

• 當 package-lock.json 中的依賴和 package.json 中不一致時，npm ci 會退出但不會修改 package-lock.json 文件。

11. 刪除重複的包

我們可以通過運行 npm dedupe 命令來刪除重複的依賴項。該命令通過刪除重複包並在多個依賴包之間共享公共依賴項來簡化整體的結構。它會產生一個扁平的、去重的樹。

npm dedupe
npm ddp

12. 掃描漏洞

可以運行 npm audit 命令來掃描項目，來查找所有依賴項中存在的漏洞：

npm audit

下面是掃描結果：

可以運行以下命令來自動安裝所有易受攻擊包的補丁版本：

npm audit fix

13. 查看已安裝的包

可以通過以下命令來獲取整個項目的包信息：

npm list

npm list 命令以樹型結構列出當前項目安裝的所有模塊，以及它們依賴的模塊。

如果加上 global 參數，就會列出全局安裝的模塊：

npm list -global

也可以查看指定包的依賴，比如在我現在做的項目下，執行以下命令：

npm list react

還可以使用 npm ls 命令來查看指定包的依賴信息：

npm ls react

可以使用--depth參數來限制搜索的深度：

npm ls --depth=1

14. 測試本地包

當我們在本地開發 npm 模塊時，可以使用 npm link 命令來將本地的 npm 模塊連接到對用的項目中去，便於對模塊進行調試和測試。使用方式也很簡單，在項目中執行以下命令：

npm link

執行完該命令之後，就會爲這個 npm 包創建到全局，路徑是 {prefix}/lib/node_modules/<package>，它是一個快捷方式。之後我們就可以使用以下命令來在需要這個模塊的項目中鏈接這個包：

npm link 模塊名

這裏的模塊名就是依賴包的名稱，也就是模塊包的 package.json 文件中的 name 字段值。

如果不想繼續使用了，執行以下命令來解除 link 即可：

npm unlink 模塊名

本文由 Readfog 進行 AMP 轉碼，版權歸原作者所有。
來源：https://mp.weixin.qq.com/s/AWEd7-RpUytoCYVkwPIYuA