首頁 > web前端 > js教程 > 了解套件管理器:pnpm、npm、yarn

了解套件管理器:pnpm、npm、yarn

PHPz
發布: 2024-08-09 01:00:22
原創
1070 人瀏覽過

Understanding Package Managers: pnpm vs npm vs yarn

了解套件管理器:pnpm、npm、yarn

現在您可能應該知道套件管理器是 JavaScript 生態系統中的重要工具,它可以自動執行安裝、更新、設定和刪除專案依賴項的過程。我將嘗試對三種流行的套件管理器進行深入比較:pnpm、npm 和yarn,解釋它們的內部工作原理、主要功能以及對開發人員的實際影響。

首先,我們應該知道這個套件管理器具有相同的功能,但它們有不同的實作方式。我們將會關注它們。

npm(節點套件管理器)

首先我們來談談 NPM(Node Package Manager),這個套件管理器是 Node.js 的預設套件管理器,它是一個執行環境,可以在瀏覽器之外的伺服器端執行 JavaScript 程式碼。你們可能都知道 npm,因為幾乎所有初學者和學習者在開始時都了解 npm。此外,NPM 還可以透過 package.json 檔案中定義的自訂腳本實現執行測試、建置專案或部署程式碼等任務的自動化。它是 JavaScript 生態系統中的重要工具,特別是對於 Node.js 開發而言,可以更輕鬆地管理和共享可重複使用程式碼。

npm 的工作原理:

  1. 依賴解析:
- npm reads the `package.json` file to determine project dependencies.

- It constructs a dependency graph, resolving version conflicts using a deterministic algorithm.
登入後複製
  1. 安裝
- npm installs packages in a nested structure within the `node_modules` folder.

- Example structure:
登入後複製
    ```
    Copy
    ```
登入後複製
登入後複製
    `node_modules/ ├── package-a/ │ └── node_modules/ │ └── package-b/ └── package-c/`
登入後複製
  1. 扁平結構:
- npm v3+ attempts to flatten the dependency tree to reduce duplication.

- This can lead to "dependency hell" where different versions of the same package are required.
登入後複製
  1. 包鎖:
- Uses `package-lock.json` to ensure consistent installs across environments.

- Contains the exact version of each package in the dependency tree.
登入後複製
  1. 腳本
- Allows defining custom scripts in `package.json`.

- Example:
登入後複製
    ```
    json
    ```
登入後複製
登入後複製
    Copy

    `"scripts": { "start": "node server.js", "test": "jest" }`
登入後複製

優點

  • 最大的軟體包生態系統,擁有超過 150 萬個軟體包

  • 內建 Node.js

  • 廣泛的文件和社群支持

缺點

  • 與yarn和pnpm相比安裝速度較慢

  • 可能會導致大型 node_modules 資料夾(有時被戲稱為「node_modules 黑洞」)

  • 潛在的依賴衝突

Yarn 是 JavaScript 的套件管理器,由 Facebook 與其他公司合作開發,作為 NPM 的替代品。它旨在提高 JavaScript 專案中依賴管理的速度、可靠性和安全性。 Yarn 透過使用快取在本機儲存下載的套件來增強效能,從而加快後續安裝的速度。它還透過產生一個yarn.lock檔案來確保跨環境的一致性,該檔案鎖定專案中使用的依賴項的確切版本,從而防止不同設定之間的差異。此外,Yarn 還提供更好的離線支援、更具可預測性和確定性的安裝,並透過驗證下載包的完整性來提高安全性。這些功能使 Yarn 成為管理專案相依性的熱門選擇,特別是在更大或更複雜的 JavaScript 專案中。

紗線的工作原理:

  1. 依賴解析:
- Like npm, yarn uses `package.json` for dependency information.

- Implements a more sophisticated resolution algorithm to handle complex dependency graphs.
登入後複製
  1. 並行安裝:
- Installs packages in parallel, significantly improving speed.

- Uses a global cache to store downloaded packages, reducing network usage.
登入後複製
  1. 離線模式
- Caches packages for offline use.

- Can install dependencies without an internet connection if they're in the cache.
登入後複製
  1. 確定性安裝
- Uses `yarn.lock` for consistent installations across different machines.

- Ensures that the same dependencies are installed regardless of install order.
登入後複製
  1. 工作空間
- Supports monorepo structures with workspaces.

- Example `package.json` for a workspace:
登入後複製
    ```
    json
    ```
登入後複製
登入後複製
    Copy

    `{ "private": true, "workspaces": ["packages/*"] }`
登入後複製

優點

  • 比 npm 更快,特別是對於大型專案

  • 可靠且一致的安裝

  • 增強的安全功能(校驗與驗證)

缺點

  • 仍然建立大型 Node_modules 資料夾

  • 某些功能需要使用特定於 Yarn 的命令

PNPM

pnpm 是一種快速、節省磁碟空間的 JavaScript 套件管理器,是 NPM 和 Yarn 的替代品。它旨在透過在電腦上建立單一套件儲存空間來提高效能並節省磁碟空間,而不是在多個專案之間複製依賴項。當您使用 pnpm 安裝軟體包時,它會建立到共享儲存的硬鏈接,從而使安裝過程更快並減少整體磁碟空間使用。

pnpm also ensures that dependencies are strictly isolated, which can prevent potential conflicts and issues in your projects. This strictness helps maintain consistency and reliability, particularly in complex projects with many dependencies. Additionally, pnpm supports features like workspaces, allowing you to manage multiple related projects within a single repository. Its efficiency and focus on performance make pnpm an attractive choice for developers looking to optimize their development workflow.

How pnpm works:

  1. Content-Addressable Storage:
- Stores all packages in a global store, typically located in `~/.pnpm-store`.

- Each project links to this store instead of having its own copy of packages.
登入後複製
  1. Symlinks:
- Uses symlinks to create a nested `node_modules` structure.

- Example structure:
登入後複製
    ```
    Copy
    ```
登入後複製
登入後複製
    `node_modules/ ├── .pnpm/ │ ├── package-a@1.0.0/ │ └── package-b@2.0.0/ ├── package-a -> .pnpm/package-a@1.0.0/node_modules/package-a └── package-b -> .pnpm/package-b@2.0.0/node_modules/package-b`
登入後複製
  1. Efficient Storage:
- Only one copy of a module version is saved on disk, regardless of how many projects use it.

- This can save gigabytes of disk space for large projects or multiple projects on the same machine.
登入後複製
  1. Strict Mode:
- Prevents packages from accessing arbitrary packages in the `node_modules` folder.

- Ensures that only declared dependencies are accessible, improving security and preventing "phantom dependencies".
登入後複製
  1. Monorepo Support:
- Native support for monorepos without additional tools.

- Example `pnpm-workspace.yaml`:
登入後複製
    ```
    yaml
    ```
登入後複製
    Copy

    `packages: - 'packages/*'`
登入後複製

Pros:

  • Dramatically saves disk space

  • Fast installation and updates

  • Ensures package isolation and prevents phantom dependencies

  • Built-in monorepo support

Cons:

  • Less widely adopted compared to npm and yarn

  • May have compatibility issues with some tools expecting a traditional node_modules structure

  • Learning curve for developers used to npm or yarn

Comparison Summary

  1. Installation Speed:
- pnpm > yarn > npm

- pnpm and yarn are significantly faster than npm, especially for larger projects.
登入後複製
  1. Disk Space Usage:
- pnpm > yarn ≈ npm

- pnpm can save up to 80% disk space compared to npm for projects with many dependencies.
登入後複製
  1. Ecosystem & Adoption:
- npm > yarn > pnpm

- npm has the largest ecosystem, but yarn and pnpm are gaining popularity.
登入後複製
  1. Dependency Resolution:
- All three use similar algorithms, but pnpm's approach is unique and more efficient.
登入後複製
  1. Lock File:
- All use lock files for consistency (`package-lock.json`, `yarn.lock`, `pnpm-lock.yaml`)

- Lock files ensure reproducible builds across different environments.
登入後複製
  1. Monorepo Support:
- pnpm > yarn > npm

- pnpm and yarn have built-in support for monorepos, while npm requires additional tools.
登入後複製
  1. Security:
- pnpm > yarn > npm

- pnpm's strict mode and yarn's checksum verification provide additional security layers.
登入後複製

Practical Implications

  1. Project Onboarding:
- npm is often the easiest for new developers due to its ubiquity.

- pnpm and yarn may require additional setup but can significantly improve project efficiency.
登入後複製
  1. CI/CD Performance:
- pnpm and yarn can dramatically reduce build times in CI/CD pipelines due to their faster installation and caching mechanisms.
登入後複製
  1. Disk Space in Docker:
- Using pnpm can significantly reduce Docker image sizes for Node.js applications.
登入後複製
  1. Large-Scale Development:
- For large projects or organizations working on multiple projects, pnpm's space-saving feature can be a game-changer.
登入後複製
  1. Monorepo Management:
- pnpm and yarn are better suited for managing monorepos without additional tools.<br>
登入後複製




My Take

While a lot of you uses npm and yarn. Me and a lot of developers is moving to pnpm. The main reason is not only that its fast, but it also does not eat a lot of your storage. For me, that is the very main thing why I started using pnpm. If you think different than I am, please comment down bellow. Let me know what you guys think.

以上是了解套件管理器:pnpm、npm、yarn的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板