歡迎關注前端早茶，與廣東靚仔攜手共同進階

前端早茶專注前端，一起結伴同行，緊跟業界發展步伐~

前言

在過去，一個簡單的文字編輯器就足以讓開發人員建立和管理大部分專案。但從那以後，WEB發生了翻天覆地的變化，如今，即使是一個相當簡單的專案，通常也會有成百上千個帶有複雜巢狀依賴關係的指令碼，如果沒有自動化工具，這些指令碼根本無法有序的管理，這時就需要包管理器。

包管理器是一種以各種方式自動處理專案依賴關係的工具。例如，在包管理器的幫助下，可以安裝、解除安裝、更新和升級包，配置專案設定、執行指令碼等等。所有複雜和乏味的工作都由包管理器完成，讓開發人員專注於編碼。

npm 是Node的包管理器，它於2010年釋出，開啟了web開發的新時代。在此之前，專案依賴庫都是手動下載和管理的，npm 是把WEB開發推向了一個更高的階段。

npm 主要做三件事：

• 一個用於管理 npm 體驗各個方面的網站
• 用於訪問廣泛的 JavaScript 包公共資料庫的登錄檔
• 用於通過終端與 npm 互動的命令列介面（CLI）

然而，大多數人談論 npm 時，通常指的是最後一個 CLI 工具。它作為預設包管理器與每個新的 Node版本一起釋出。

yarn 代表另一個資源談判者。yarn 包管理器是 npm 的一個替代方案，由Facebook於2016年10月釋出。yarn最初的目標是處理npm的缺點，比如效能和安全問題。yarn很快被定位為一個安全、快速、可靠的JavaScript依賴管理工具。

但是 npm 團隊吸取了教訓，並通過實現缺失的功能迅速填補了 npm 的空白。

下面來看一個時間線：

• 2010年：釋出了支援Node的npm。
• 2016年：Yarn釋出。它展現了比npm更好的效能。它也會生成yarn.lock檔案，使共享和精確複製回購更容易和可預測。
• 2017年：NPM 5釋出。它提供自動生成的包鎖package-lock.json檔案應對yarn.lock。
• 2018年：NPM 6的釋出提高了安全性。現在，npm在安裝依賴項之前會檢查安全漏洞。
• 2020年：Yarn 2和npm 7釋出。這兩個包都有很棒的新特性。
• 2021年：Yarn 3釋出了各種改進。

如今，這兩種包管理器在包管理競賽中並駕齊下，提供了相似的特性和功能。但仍有一些差異，有助於選擇使用。

安裝比較

從 npm 和 yarn 的安裝過程開始來進行比較。

安裝包管理器

正如上面提到的，npm 是預先安裝在 Node 中的，所以一般不需要手動安裝 npm。

相反，yarn 需要顯式安裝，首先，需要全域性安裝 yarn：

npm install -g yarn

然後，可以通過在專案中設定所需的版本，在每個專案的基礎上使用它。通過在專案的根目錄中執行yarn set version命令來設定所需要的版本：

yarn set version berry

berry就是要設定的版本號。如果想更新到最新版本，執行：

yarn set version latest

使用 yarn，可以為每個專案使用不同的版本。而對 npm 要實現同樣的需求，則需要安裝 nvm（Node版本管理器）。

安裝專案依賴

現在，就來看看如何安裝專案依賴項。 當執行npm install時，依賴項會依次安裝，終端中會輸出詳細的安裝日誌，不過閱讀性不好。

使用 yarn 安裝包，執行yarn命令。yarn 是並行安裝包的，這也是它比 npm 快的原因之一。如果正在使用yarn 1，將看到 yarn 輸出的安裝日誌比較簡潔，閱讀性也比較好。為了方便閱讀，它們以樹狀排列。但是這在版本2和版本3中有所改變，其中的日誌不是那麼直觀和可讀。

到目前為止，已經看到 npm 和 yarn 有不同的安裝包命令。

命令比較

npm 和 yarn 很多命令是一樣的，但也有許多不同的命令。先來看看相同的命令：

• npm init | yarn init：建立一個新包
• npm run | yarn run：執行package.json中定義的指令碼
• npm test | yarn test：測試一個包
• npm publish | yarn publish：釋出一個包
• npm cache clean | yarn cache clean：從快取資料夾中刪除所有資料

這些命令使兩個管理器之間的切換變得容易，但有一些不同的命令可能會導致混淆。

• npm install | yarn：安裝依賴
• npm install [package] | yarn add [package]：安裝一個包
• npm install --save-dev [package] | yarn add --dev [package]：安裝包作為開發依賴項
• npm uninstall [package] | yarn remove [package]：解除安裝一個包
• npm uninstall --save-dev [package] | yarn remove [package]：解除安裝開發依賴包
• npm update | yarn upgrade：更新的依賴關係
• npm update [package] | yarn upgrade [package]：更新包

yarn 還有一些獨特的命令，這些命令在 npm 下沒有相同的。例如，why命令顯示需要一個包的原因：它可能是一個依賴項、一個本地模組或一個專案依賴項。

速度和效能

每當 yarn 或 npm 需要安裝包時，它們都會執行一系列任務。在 npm 中，這些任務是按包順序逐個執行安裝的，這意味著它會等待一個包完全安裝，然後再繼續下一個。相比之下，yarn 是並行執行這些任務，在效能上有顯著的提高。

雖然這兩種管理器都提供快取機制，但yarn似乎做得更好一些。通過實現零安裝模式，它幾乎能夠在短時間內安裝包。它快取每個包並將其儲存在磁碟上，所以在下一次安裝這個包時，甚至不需要有網際網路連線，因為包是從磁碟離線安裝的。

儘管yarn有一些優勢，但 yarn 和 npm 在它們的最新版本中的速度相當，所以現在算不分伯仲。

安全性比較

對 npm 的主要批評之一是在安全性方面，以前的 npm 版本有幾個嚴重的安全漏洞。然而從版本 6 開始，npm 在安裝過程中稽核軟體包並顯示是否發現任何漏洞。可以通過對已安裝的軟體包執行npm audit來手動執行此檢查，如果發現任何漏洞，npm 會給出相應的安全建議。如發現有安全漏洞，可以執行npm audit fix來修復包漏洞。

在安全性上，yarn 和 npm 都使用加密雜湊演算法來確保包的完整性。

功能比較

就如上面介紹的命令一樣，一些特性是 npm 和 yarn 共有的，但也有一些區別，下面就來介紹主要的區別。

生成的鎖定檔案

在package.json檔案中，npm 和 yarn 都在其中跟蹤專案的依賴項，版本號並不總是準確的，相反，可以定義一系列版本。這樣，可以選擇一個包的主版本和小版本，但允許npm安裝可能修復一些bug的最新補丁。

在語義版本控制的理想狀態下，補丁版本不會包含任何破壞性的更改。但顯示總是和理想有區別，導致真實情況下並非如此。npm 採用的策略可能會導致兩臺機器以相同的package.json檔案結束，但安裝了不同版本的包，這就埋下了可能產生bug的問題。

為避免包版本不匹配，確切安裝的版本被固定在包鎖定檔案中，每次新增模組時，npm 和 yarn 分別建立（或更新）一個package-lock.json和yarn.lock檔案。

使用工作空間

工作區允許擁有一個monorepo來管理跨多個專案的依賴項，這意味著有一個單一的頂級根包，其中包含多個稱為工作區的子包。

遠端執行指令碼

npx命令用於從./node_modules/.bin執行指令碼。它還允許從 npm 登錄檔中執行包，而無需將它們安裝在專案依賴項中。例如，可以通過執行以下命令來建立一個新的 React 應用程式：

npx create-react-app my-app

在 yarn 中，可以使用等效的dlx命令獲得相同的結果：

yarn dlx create-react-app my-app

下面將介紹 yarn 獨有的功能。

零安裝

零安裝將快取儲存在專案目錄中的.yarn資料夾中。當使用yarn或yarn add <package>等命令時，yarn 會建立一個.pnp.cjs檔案，此檔案包含 Node 用於載入專案包的依賴關係層次結構。因此，幾乎可以在零時間訪問它們。

即插即用

即插即用是另一種安裝策略，yarn 沒有生成node_modules目錄並將解析留給 Node，而是生成單個.pnp.cjs檔案，該檔案將包對映到它們在磁碟上的位置及其依賴項列表。這個特性可以導致更快的專案啟動、更好的優化依賴樹、更快的安裝時間，當然也不需要node_modules資料夾。

Licenses

yarn 包含一個內建的許可證檢查器，可在開發應用程式時在不同場景中使用。

選擇哪個包管理器

上面已經討論了 npm 和 yarn 的各種相似和不同之處，但是還沒有確定哪一個更好，應該選擇哪一個，但是還是那句話，適合的團隊或者專案的才是最重要。

下面給出一個推薦的建議：

• 選擇 npm ：如果對當前的工作流程感到滿意，不想安裝額外的工具，並且沒有很多磁碟空間。
• 選擇 yarn ：如果想要一些很棒的功能，比如即插即用，需要一些 npm 中缺少的功能，並且有足夠的磁碟空間

如果仍然很難在 npm 和 yarn 之間做出明確的決定，那就無需在意，隨便用那一個都基本可以滿足專案開發要求。

總結

包管理器對現代 web 開發非常的重要，本文比較了市場上兩個最受歡迎的包管理器，它們都有各自的優點和缺點，選擇最適合專案的。

歡迎關注前端早茶，與廣東靚仔攜手共同進階

前端早茶專注前端，一起結伴同行，緊跟業界發展步伐~