npx: npm包執行工具

NDOER發表於2019-12-14

npm  全名為 Node Package Manage ,是 Node.js 的包管理工具, npm  讓開發者更容易安裝和管理專案中的依賴項,使得它在現代的前端開發工作中成為了一個得力的工具,而在 npm@5.2.0 版本之後,增加 npx  以提供來一些輔助的功能。本文主要來介紹 npx 的特性與其存在的意義。

定址呼叫

如果一個 npm 包配置了 bin ,當這個包被安裝的時候,在專案的 node_modules/.bin 下就有會相應的指令來方便執行。

例如:在專案中新增了 next 來構建 SSR 專案,那麼node_modules/.bin 下就會有 next 的命令。

image.png

如果需要呼叫 next 相關的命令,比如查詢 next 版本:

以往的方式:

node node_module/.bin/next -v
複製程式碼

npm script 方式:

{
  "script": {
    "next-v": "node node_module/.bin/next -v"
  }
}
複製程式碼
npm run next-v
複製程式碼

npx 方式:

npx next -v
複製程式碼

在呼叫一些安裝包的內建命令時,比如在使用 Jest 進行測試單個檔案的時候,對於寫 npm script 和 手動呼叫 node_modules 下的命令就不太友好,使用 npx 會方便很多。

npx 在定址呼叫的時候,會到專案的 node_modules/.bin 路徑和系統的 path 中進行查詢,檢查命令是否存在。如果不存在則會臨時下載或執行程式包或進行使用。

執行一次性命令

例如本地不存在 http-server 模組,則會自動臨時下載安裝,然後在當前目錄進行啟動一個 web 服務,這相當於一次性的命令。

image.png

再舉個例子,檢查網站的可訪問性得分:

image.png

在這之前你是否有遇見過想要嘗試一些CLI工具建立專案,但是卻要進行全域性安裝然後在進行建立,如果這個CLI工具只使用一次呢?比如利用 create-react-app 來建立 React 專案,使用 npx 來建立就可以避免這個問題,而且不用擔心使用時的升級問題,因為 npx 確保使用最新的生成器或者軟體包。

npx create-react-app my-react-repo
複製程式碼

這樣 npx 會自動從登錄檔中安裝 create-react-app 軟體包,並呼叫它,呼叫完成後又不會儲存在全域性檔案中沒,因此不會汙染全域性安裝或需要多個步驟。這個特性非常適合生成器之類的軟體包,比如 create-react-appvue-cliyeoman 等。

# 使用npx建立vue專案
npx -p @vue/cli vue create hello-word
複製程式碼

切換node版本

在一些場景下使用npx 切換 Node 版本,比用像 nvmnaven 這樣的 Node 版本管理工具會方便很多。

$ npx node@0.12.8 -v
v0.12.8
複製程式碼

執行遠端模組

npx 從URL執行程式包,但前提是URL上的遠端程式碼必須是一個模組,即必須包含 package.json 和入口指令碼。

image.png

常用引數

-p

-p or --package <package> 定義要安裝的軟體包,並新增到正在執行的$PATH

--no-install

npx 強制使用本地模組,不下載遠端模組,如果本地沒有該模組則會出錯。

--ignore-existing

--no-install 相反,讓 npx 強制使用遠端模組。

--cache

設定 npm 快取的位置,否則為 npm 預設快取位置。

-c

npm run-script類似外殼程式的環境中執行,並提供所有常用的環境變數。如果 NPX 安裝了多個模組,只有 <string> 引數的第一個項會被當作命令執行,其他的就須要加上 -p 選項。

-q, --quiet

禁止npx本身的任何輸出(進度條,錯誤訊息,安裝報告),子命令輸出本身不會被禁止。

-n, --node-arg

當二進位制是node指令碼時,提供給node的額外引數。

-v, --version

檢視 npx 版本

文章最後

通過以上我們知道 npx 是一種執行 npm 包的工具,它很好的提升了使用 npm 包的體驗。 npm 使得在開發中方便的安裝和管理登錄檔中託管的依賴項,而 npx  使得更容易使用登錄檔中 CLI 工具和託管的其他可執行檔案。解決了之前沒有便捷的方式來互動式地呼叫本地二進位制檔案的問題,使得專案的開發管理提升了便捷性。

相關文章:

相關文章