依賴管理工具 Yarn 簡(jiǎn)介

大家好，今天我們開始一個(gè)新專題 — Yarn。了解前端開發(fā)的同學(xué)可能會(huì)習(xí)慣于使用 npm 或者
cnpm 作為我們項(xiàng)目的包管理工具，它們?cè)诮o我們的日常開發(fā)帶來便利的同時(shí)，也伴隨著，如：安裝慢、無法保持包的一致性等讓開發(fā)者頭疼的問題，于是作為 Npm 的直接競(jìng)爭(zhēng)對(duì)手 Yarn 誕生了，本文將從 Yarn 是什么，它有哪些優(yōu)點(diǎn)，如何使用等方面向大家詳細(xì)介紹 Yarn。

1. Yarn 的前世今生

1.1 包管理工具的介紹

大家都知道 Yarn 是包管理工具，那么在學(xué)習(xí) Yarn 之前，我們有必要討論一下，包管理工具是什么。

在近幾年之前得前端項(xiàng)目中，我們聰明得前端工程師們就已經(jīng)開始使用如 jQuery 等經(jīng)典的第三方 JS 工具庫，這大大得提高了我們前端項(xiàng)目得開發(fā)速度。 我們使用它的方法一般為，在 jQuery 官網(wǎng)上下載相關(guān)版本得 JS 靜態(tài)文件，然后放到我們自己的項(xiàng)目中，引用它封裝的相關(guān)方法去實(shí)現(xiàn)我們的需求，或者還有其他得一些如 CDN 引用等方式。

使用了一段時(shí)間之后，我們發(fā)現(xiàn)，這種開發(fā)方式，比之前我們純手寫或者復(fù)制粘貼代碼的效率快了一大截，但是也暴露出一些致命缺陷，如以下使用場(chǎng)景：

• 如果我們引用的 lib1.js，它同時(shí)依賴于lib2.js 和 lib3.js，那么我們?cè)谙螺d lib1.js 的同時(shí)，也要將 lib2.js 和 lib3.js 一起下載，并且在文件里他們的引用順序也有講究，如果 3 個(gè)文件的順序不對(duì)，也會(huì)出現(xiàn)一些莫名其妙的問題。
• 第三方 JS 工具庫的作者可能會(huì)增加、優(yōu)化一些代碼邏輯，或者只是修改一些其他開發(fā)者提出的 Bug，然后他們會(huì)把最新代碼包發(fā)布到自己的官網(wǎng)。而作為開發(fā)者的我們，就要經(jīng)常關(guān)注這些項(xiàng)目里使用的第三方庫的動(dòng)態(tài)，如果升級(jí)就要重復(fù)之前的操作，將文件重新手動(dòng)下載下來，替換項(xiàng)目中之前的文件。
• 工具的版本問題，我們想升級(jí)項(xiàng)目中的依賴工具，就要去尋找資源，手動(dòng)下載，手動(dòng)替換。

在這些問題被發(fā)現(xiàn)之后，一批富有開拓精神的程序員們提出了他們新的想法和思路，于是 npm 的出現(xiàn)，徹底的終結(jié)了以上這些問題。

1.2 Npm 的橫空出世

作為各種包管理工具中最早出現(xiàn)的開拓者，Npm 是 Node.js 官方提供的，他的出現(xiàn)同時(shí)也制定了一些列的包管理規(guī)范，如：

• 將所有第三方依賴包放在 node_modules 這個(gè)文件目錄下，我們?cè)谠黾樱瑒h除，升級(jí)依賴也只是更新這個(gè)文件下的相關(guān)依賴包。
• 增加 package.json 文件，這個(gè)文件中存放本項(xiàng)目及項(xiàng)目的依賴和版本信息，這樣我們就可以一目了然的了解本項(xiàng)目用到了什么，都是什么版本的，不用多處尋找。
• 在使用依賴時(shí)，Node 提供的支持是內(nèi)置的 require 方法，默認(rèn)會(huì)到這個(gè)目錄下去檢索模塊，無需手動(dòng)指定路徑。

如此一來，有了 Npm 的加持，JavaScript 從一門不被看好得弱類型語言，發(fā)展到了現(xiàn)在可以勝任大型前端項(xiàng)目開發(fā)，實(shí)現(xiàn)模塊化，工程化的前端項(xiàng)目搭建，穩(wěn)定了前后端分離的發(fā)展思路。

Npm 已經(jīng)奠定了前端工程基礎(chǔ)，但是追求完美的前端程序員們又基于 Npm 不足的地方，提供了新的完善思路，針對(duì)如 Npm 安裝包的速度問題，包的版本問題加以改善。所以今天我們要學(xué)習(xí)的 Yarn 就是用來解決這些問題的。

2. Yarn 的介紹

關(guān)于 Yarn 官網(wǎng)中有如下介紹：

Yarn is a package manager for your code. It allows you to use and share code with other developers from around the world. Yarn does this quickly, securely, and reliably so you don’t ever have to worry. —官網(wǎng)

簡(jiǎn)單翻譯成中文就是，yarn作為項(xiàng)目的包管理工具，快速、安全、可靠。你下載的包將不再重新下載。而且確保在不同系統(tǒng)中可以正常工作。

這里我們看到Yarn官方推薦的三個(gè)特點(diǎn)：

• 速度快: Yarn 緩存了每個(gè)下載過的包，再次使用時(shí)無需重復(fù)下載。同時(shí)它是并行的，因此安裝速度更快
• 安全: 在執(zhí)行代碼之前，Yarn 會(huì)通過算法校驗(yàn)每個(gè)安裝包的完整性。
• 可靠: 使用詳細(xì)、簡(jiǎn)潔的鎖文件格式和明確的安裝算法，使 Yarn 能夠在不同系統(tǒng)上保證無差異的工作。

通過上面的介紹，我們可以總結(jié)出：Yarn 是基于 Npm 的不足之處做出了全新的改版升級(jí)，但是我們并不能說 Yarn 的出現(xiàn)會(huì)完全取代 Npm，因?yàn)槟壳暗?Yarn ，只是完善升級(jí)了 Npm，讓開發(fā)者們有了更好的體驗(yàn)，但截至目前為止，Yarn 并沒有實(shí)現(xiàn)全部的 Npm 命令及功能。

3. 使用 Npm 的缺點(diǎn)（競(jìng)品對(duì)比）

• 感受過上文 yarn 安裝依賴的速度，對(duì)比 Npm，就會(huì)感覺等待 Npm 安裝進(jìn)度條是一個(gè)很漫長(zhǎng)的過程，尤其是在網(wǎng)速不好的情況下，當(dāng)然大家也可以使用 Npm 在國(guó)內(nèi)的淘寶鏡像服務(wù) cnpm，這樣速度雖然提升了，但是安裝之后運(yùn)行時(shí)的各種問題，也是開發(fā)者一直所詬病的，所以在速度上，yarn 碾壓 npm
• 關(guān)于錯(cuò)誤提示，yarn 做的更加人性化，使用 npm 時(shí)，如果安裝某一個(gè)依賴發(fā)生錯(cuò)誤，npm 會(huì)繼續(xù)打印之后的安裝日志，這樣依賴很多的大型項(xiàng)目，開發(fā)者很難注意到到底哪里安裝報(bào)錯(cuò)
• 在 npm5 之前，npm 安裝無法保證版本的一致性，如：“1.0.3”、“～1.0.3”、"^1.0.3"這三個(gè)命令分別代表著：安裝指定的 1.0.3 版本、安裝 1.0.X 中最新的版本、
  安裝 1.X.X 中最新的版本，這樣雖然更詳細(xì)，但也給學(xué)習(xí)中的開發(fā)者增加極大的學(xué)習(xí)成本。

yarn 為了解決以上的問題，增加了 yarn.lock 鎖文件，這個(gè)方案讓開發(fā)者不必再擔(dān)心項(xiàng)目中其他成員安裝的依賴版本不同，保證了在不同環(huán)境下項(xiàng)目都能完美運(yùn)行。并且 yarn 的安裝日志顯然比 npm 更簡(jiǎn)潔且易于閱讀。

4. Yarn 和 npm 能否同時(shí)使用？

可以的，上文提到，yarn 是對(duì) npm 進(jìn)行了安裝和提升，實(shí)現(xiàn)了 npm大 部分的命令和功能，且二者都遵循 package.json 文件，所以我們也不用擔(dān)心兼容問題，yarn 完全沒有侵入性。我本人在實(shí)際運(yùn)用場(chǎng)景中，也經(jīng)常使用 yarn 在安裝或刪除依賴文件，使用 npm 運(yùn)行項(xiàng)目中定義的如：?jiǎn)?dòng)命令，打包命令等，所以二者完全可以同時(shí)使用。

5. 在項(xiàng)目中如何安裝及使用 Yarn

5.1 安裝

yarn 有很多種安裝方式，對(duì)于不同的系統(tǒng)，我們可以區(qū)別安裝，在這里我推薦大家使用 Npm 去安裝，這種方法最方便簡(jiǎn)潔。

 npm i -g yarn

5.2 關(guān)于使用

在一個(gè)新項(xiàng)目中，我們通常按照以下步驟去使用 yarn：

1. 寫入生成package.json，確定項(xiàng)目中需要哪些依賴（如果已有該文件跳過本步驟）。
2. 執(zhí)行 yarn 初始化項(xiàng)目依賴，生成 yarn.lock 文件。
3. 通過yarn add 命令添加需要安裝的依賴。
4. 確定想升級(jí)某個(gè)依賴的最新版本時(shí)，使用yarn upgrad命令升級(jí)。

以上是簡(jiǎn)單介紹關(guān)于 yarn 得使用方法，因?yàn)樵谥蟮孟嚓P(guān)小節(jié)里，有針對(duì)于 yarn 使用方法和常用命令的詳細(xì)講解，在這里就不再贅述了。希望大家持續(xù)關(guān)注之后的章節(jié)，更加深入的學(xué)習(xí)關(guān)于 yarn 的知識(shí)和技能。

6. 學(xué)習(xí)與總結(jié)

yarn 的學(xué)習(xí)成本非常低，它本身就是為了簡(jiǎn)化 npm 的命令，提高安裝依賴的速度和效率而誕生的工具，希望同學(xué)們可以認(rèn)真學(xué)習(xí)，并且在項(xiàng)目中多多實(shí)踐。

7. 關(guān)于前置基礎(chǔ)及技能

我們知道，yarn 是跟 npm 很相似的前端依賴管理工具，不過他比 npm 更加方便高效，也更加簡(jiǎn)單。所以為了方便理解 Yarn 的使用及原理，可以先了解 npm 的用法，當(dāng)然如果想直接學(xué)習(xí) yarn ，相信大家只要認(rèn)真努力，也一樣可以學(xué)得會(huì)。加油！