3分鐘看完前端進階——yarn VS npm

醬菜豪發表於2018-10-08

npm想必大家都知道,而且用的非常熟練了。
按照以往習慣,我們上來就是

npm install xxx   //新增專案依賴包
...
npm start         //執行專案
複製程式碼

而今天我們主角是——Yarn,一個新的依賴包管理工具,它的用法和npm非常類似,請看

yarn add xxx   //新增專案依賴包
...
yarn start     //執行專案
複製程式碼

也許有人會問了,這npm能幹的活,為啥yarn要搶它的飯碗呢?我們進入正題!

什麼是Yarn

Yarn的官方文件:yarn.bootcss.com/
Yarn的github地址:github.com/yarnpkg/yar…
簡單來說,Yarn是由Facebook釋出的一款新的JS依賴包管理工具,正如官網所說:"快速、可靠、安全的依賴管理工具。"

3分鐘看完前端進階——yarn VS npm

為什麼用Yarn

我覺得,最直觀的感受就是速度快
yarn的速度嘛,可以說是秒殺npm啦。用過npm就知道,不僅下載速度慢,而且有時候中途會出錯!!無法忍受真的是o(╥﹏╥)o
說說yarn的下載特點

  • yarn在下載包時,會快取每個下載過的包,所以再次使用時無需重複下載。
  • yarn利用了並行下載的特點(可同時下載多個包),以最大化資源利用率,因此安裝速度更快。

當然yarn還有很多優點,我們看看官網說的吧

3分鐘看完前端進階——yarn VS npm
所以,你還在等什麼?!

上乾貨!

安裝yarn

npm install yarn -g

安裝完後就可以像npm一樣立即使用它的命令

這是常用的yarn命令

yarn npm 說明
yarn init npm init 初始化專案,生成package.json檔案
yarn add 模組名 npm install 模組名 --save 在本目錄下新增專案的依賴包,並在package.json下寫入配置
yarn global add 模組名 npm install 模組名 -g 在全域性下新增專案的依賴包
yarn add 模組名 --dev npm install 模組名 --save-dev 在本目錄下新增某個開發時依賴包
yarn remove 模組名 npm uninstall 模組名 移除本目錄下指定的專案依賴包
yarn upgrade 模組名 npm update 模組名 --save 更新本目錄下指定的專案依賴包

細節:

  • 全域性安裝&普通安裝
    普通安裝(不帶global或-g),安裝的地址在本目錄下,只能在這個目錄下使用這些模組檔案
    全域性安裝,安裝的目錄在全域性的目錄下,安裝後可以在任意目錄下使用
  • -dev
    dev是開發版的意思,是我們在開發時需要用的版本。比如專案中使用的gulp,壓縮css、js的模組。這些模組在我們開發完畢,專案部署後是不需要的,所以我們可以使用 -save-dev 的形式安裝。像express 這些模組是專案執行必備的,所以我們應該使用-save的形式安裝。

總結

通過以上的對比,yarn確實更具優勢。如果你對yarn感興趣,或是被npm下載速度給坑慘了,不妨試一試,相信這篇文章或多或少會對你有點幫助吧。(* ̄︶ ̄)

相關文章