紅寶書第三十一講：通俗易懂的包管理器指南：npm 與 Yarn

資料取自《JavaScript高級(jí)程序設(shè)計(jì)（第5版）》。
查看總目錄：紅寶書學(xué)習(xí)大綱

一、基礎(chǔ)概念

包管理器：幫你自動(dòng)下載和管理第三方代碼庫(kù)（如React、Lodash）的工具 ^[1]。
核心作用：

1. 安裝依賴：從公共倉(cāng)庫(kù)獲取代碼包
2. 版本管理：明確指定項(xiàng)目依賴的版本
3. 腳本自動(dòng)化：快速執(zhí)行構(gòu)建/測(cè)試任務(wù)

二、npm（Node Package Manager）

Node.js 官方默認(rèn)工具，適合中小型項(xiàng)目 ^[1][2]。

1. 基礎(chǔ)使用步驟

flowchart TD
    A[初始化項(xiàng)目] --> B[npm init -y]
    C[安裝包] --> D[npm install lodash]
    E[卸載包] --> F[npm uninstall lodash]

常用命令：

# 初始化項(xiàng)目（生成 package.json）
npm init -y 

# 安裝生產(chǎn)依賴（會(huì)記錄在 dependencies）
npm install lodash

# 安裝開發(fā)依賴（記錄在 devDependencies）
npm install eslint --save-dev

2. 依賴管理特點(diǎn)

使用 嵌套樹結(jié)構(gòu)（每個(gè)子依賴獨(dú)立裝自己的版本）^[2]
舉例：你的項(xiàng)目依賴A和B，而A依賴D@1.0，B依賴D@2.0
→ 生成 node_modules 結(jié)構(gòu)：

node_modules/
├── A/
│   └── node_modules/
│       └── D@1.0/
└── B/
    └── node_modules/
        └── D@2.0/

三、Yarn（由 Facebook 開發(fā)）

專注于 更快的安裝速度和安全改進(jìn)，適合大型項(xiàng)目 ^[3]。

1. 核心優(yōu)化

• 離線緩存：重復(fù)安裝直接讀取本地緩存 ^[3]
• 鎖定版本：生成 yarn.lock 文件嚴(yán)格鎖定依賴版本
• 并行下載：比npm更快下載包

安裝方式：

# 全局安裝Yarn（需先安裝Node.js）
npm install -g yarn

# 初始化項(xiàng)目（生成 package.json）
yarn init -y

# 安裝包
yarn add axios

2. 依賴結(jié)構(gòu)扁平化

相同示例（依賴A和B，A需要D@1.0，B需要D@2.0）
→ 嘗試共享依賴但可能沖突時(shí)分開：

node_modules/
├── A/
├── B/
├── D@1.0/  # 為A安裝的版本
└── D@2.0/  # 為B安裝的版本

四、如何選擇？

五、實(shí)戰(zhàn)示例

場(chǎng)景：創(chuàng)建一個(gè)使用Lodash的項(xiàng)目

使用npm：

# 1. 初始化項(xiàng)目
npm init -y

# 2. 安裝Lodash
npm install lodash

# 3. 在代碼中使用
// index.js
const _ = require('lodash');
console.log(_.sum([1, 2, 3]));  // 輸出：6

使用Yarn：

# 1. 初始化項(xiàng)目（需全局安裝Yarn）
yarn init -y

# 2. 安裝Lodash
yarn add lodash

# 3. 運(yùn)行腳本
node index.js

目錄：總目錄
上篇文章：紅寶書第三十講：通俗易懂的JavaScript調(diào)試指南

腳注

1. 《JavaScript高級(jí)程序設(shè)計(jì)（第5版）》說明npm是Node.js的默認(rèn)包管理器 ? ?

2. 《JavaScript高級(jí)程序設(shè)計(jì)（第5版）》描述npm使用嵌套依賴樹安裝包 ? ?

3. 《JavaScript高級(jí)程序設(shè)計(jì)（第5版）》指出Yarn具備緩存和嚴(yán)格的版本鎖定 ? ? ? ?