原文地址： https://blog.csdn.net/mjzhang1993/article/details/70092902/

最初接觸 yarn 還是在 0.17.10 版本，由於各種各樣的原因，使用時沒 npm 順手, 目前 yarn 的版本已經升級為 1.7.0 各種之前遇到的問題不復存在，安裝、下載速度都比 npm 要快很多，這裡對之前記錄做一下修改。

版本說明 （當前文件使用版本）

yarn : v0.17.10
yarn: v1.3.2 (修改日期 2017.12.26)
node: v8.9.0
npm: v5.
 
6.0

安裝

1. macOS 通過 homebrew 安裝 brew install yarn

2. Windows 下載安裝 下載地址

3. 檢視版本 yarn --version

1. 開始一個新工程

yarn init 與 npm init 一樣通過互動式會話建立一個 package.json

    yarn init # yarn 
    npm init # npm

    # 跳過會話，直接通過預設值生成 package.json
    yarn init --yes # 簡寫 -y
    npm init 
 
-y

2. 新增一個依賴

通過 yarn add 新增依賴會更新 package.json 以及 yarn.lock 檔案 

yarn add <packageName> 依賴會記錄在 package.json 的 dependencies 下

yarn add [email protected] # yarn  --save 是 yarn 預設的，預設記錄在 package.json 中
npm install [email protected]
 
2.3.3 --save # npm

1. yarn add <packageName> --dev 依賴會記錄在 package.json 的 devDependencies 下

    yarn add webpack --dev # yarn 簡寫 -D
    npm install webpack --save-dev # npm

1. yarn global add <packageName> 全域性安裝依賴

    yarn global add webpack # yarn
    npm install webpack -g # npm

3. 更新一個依賴

yarn upgrade 用於更新包到基於規範範圍的最新版本

   yarn upgrade # 升級所有依賴項，不記錄在 package.json 中
    npm update # npm 可以通過 ‘--save|--save-dev’ 指定升級哪類依賴

    yarn upgrade webpack # 升級指定包
    npm update webpack --save-dev # npm

    yarn upgrade --latest # 忽略版本規則，升級到最新版本，並且更新 package.json

4. 移除一個依賴

yarn remove <packageName>

    yarn remove webpack # yarn
    npm uninstall webpack --save # npm 可以指定 --save | --save-dev 

5. 安裝 package.json 中的所有檔案

yarn 或者 yarn install

    yarn install # 或者 yarn 在 node_modules 目錄安裝 package.json 中列出的所有依賴
    npm install # npm

    # yarn install 安裝時，如果 node_modules 中有相應的包則不會重新下載 --force 可以強制重新下載安裝
    yarn install --force # 強制下載安裝
    npm install --force # npm

6. 執行指令碼

yarn run 用來執行在 package.json 中 scripts 屬性下定義的指令碼

// package.json
    {
        "scripts": {
            "dev": "node app.js",
            "start": "node app.js"
        }
    }

yarn run dev # yarn 執行 dev 對應的指令碼 node app.js
    npm run # npm

    yarn start # yarn
    npm start # npm

與 npm 一樣 可以有 yarn start 和 yarn test 兩個簡寫的執行指令碼方式

7. 顯示某個包資訊

yarn info <packageName> 可以用來檢視某個模組的最新版本資訊

    yarn info webpack # yarn 
    npm info webpack # npm

    yarn info webpack --json # 輸出 json 格式
    npm info webpack  --json # npm

    yarn info webpack readme # 輸出 README 部分
    npm info webpack readme

8. 列出專案的所有依賴

yarn list

    yarn list # 列出當前專案的依賴
    npm list # npm

    yarn list --depth=0 # 限制依賴的深度
    sudo yarn global list # 列出全域性安裝的模組

9. 管理 yarn 配置檔案

yarn config

   yarn config set key value # 設定
    npm config set key value

    yarn config get key # 讀取值
    npm config get key

    yarn config delete key # 刪除
    npm config delete key

    yarn config list # 顯示當前配置
    npm config list 

    yarn config set registry https://registry.npm.taobao.org # 設定淘寶映象
    npm config set registry https://registry.npm.taobao.org # npm

10. 快取

yarn cache

    sudo yarn cache list # 列出已快取的每個包
    sudo yarn cache dir # 返回 全域性快取位置
    sudo yarn cache clean # 清除快取

11. 問題

1. 安裝 package.json 中檔案的問題

正常安裝 sudo yarn add [email protected] package.json 中 出現

"dependencies": {
        "react": "15.4.2"

 }

通過終端檢視安裝版本 yarn list

  ├─ [email protected]
    │  ├─ [email protected]^0.8.4
    │  ├─ loose[email protected]^1.1.0
    │  └─ object[email protected]^4.1.0

是正確的版本，但是，如果在 package.json 中加上如下依賴，然後通過 sudo yarn install 安裝

 "dependencies": {
        "react": "15.4.2",
        "react-dom": "^15.4.2",
        "jquery": "^3.0.0"
    }

通過終端檢視安裝版本 yarn list

├─ [email protected]
    │  ├─ [email protected]^0.8.9
    │  ├─ loose[email protected]^1.1.0
    │  ├─ object[email protected]^4.1.0
    │  └─ prop[email protected]~15.5.0
    ├─ [email protected]15.4.2
    │  ├─ [email protected]^0.8.4
    │  ├─ loose[email protected]^1.1.0
    │  └─ object[email protected]^4.1.0
    ├─ [email protected]3.2.1

react 還是之前的版本，但是 新安裝的 react-dom 和 jquery 都變成了 最新版本

再試試將版本號的寫法變一下 去掉 ^

    "dependencies": {
        "react": "15.4.2",
        "react-dom": "15.4.2",
        "jquery": "3.0.0"
    }

通過 sudo yarn install 安裝 檢視安裝版本 yarn list

 ├─ [email protected]
    │  ├─ [email protected]^0.8.1
    │  ├─ loose[email protected]^1.1.0
    │  └─ object[email protected]^4.1.0
    ├─ [email protected]15.4.2
    │  ├─ [email protected]^0.8.4
    │  ├─ loose[email protected]^1.1.0
    │  └─ object[email protected]^4.1.0
    ├─ [email protected]3.0.0

安裝的是正確的版本了

說明

1:  "react-dom": "^15.4.2"這種寫法,加了^，是一般是通過npm install --save安裝外掛生成版本號的預設格式，表示安裝15.x.x的最新版本，安裝時不改變大版本號
2:  "react-dom": "15.4.2"這種寫法,只有版本號，是 yarn add安裝後生成版本號的預設格式，表示必須安裝同一個版本號
3:  版本號控制，有一個規範，就是語義化版本號控制，規定了版本號格式為：主版本號.次版本號.修訂號；

• 主版本號：當你做了不相容的 API 修改
• 次版本號：當你做了向下相容的功能性新增
• 修訂號：當你做了向下相容的問題修正

一般來講 只要主版本號正確，就可以相容，但是像 最新版的 [email protected] ,出現了React.createClass與React.PropTypes棄用的警告，控制檯一片紅，因為引用了第三方元件庫，最後選擇暫不升級react，類似的情況，個人感覺 yarn 預設的版本號寫法(只安裝特定版本的檔案)，更符合需求，npm 的話，很可能導致兩個擁有同樣package.json 的應用，安裝了不同版本的包，進而導致一些BUG

2. 在 yarn 或者 npm 中設定預設版本規則

npm set save-exact true 全域性設定 package.json 只記錄確切版本號 node: 1.1.1,
npm config set save-prefix '~' 設定安裝新模組時，package.json 記錄版本號的方式 ~ \ ^ 等
sudo yarn config set save-prefix '~' 通過 yarn 設定，要有 sudo 許可權

注意： 通過以上設定可以更改package.json 中記錄的版本號預設方式，但是 yarn 的設定是帶有 sudo 許可權的，通過 sudo add <packageName> 的模組才會按照設定的方式更新版本號

12. 總結

就像官網上說的，yarn 的安裝速度快，能並行化操作以最大化資源利用率；安全，Yarn會在每個安裝包被執行前校驗其完整性。正式版的 yarn 比較與 npm 更高效