Windows 環境安裝 Node.js 以及 npm & Yarn 兩款熱門 JavaScript 套件管理程式

2019/03/24 1,567 1 軟體介紹 , 網站技術 , 學業筆記 , JavaScript , Node.js

今天「網站前端封裝實務」第二次上課學到更多有關前端的技術,這些技術我很早以前就有聽聞,不過實在因為技術門檻有點高加上沒有人帶我進入這個領域,始終沒接觸,不過如果要讓網站技術有所突破,學習它們是必經的過程,因此我會依序將我所學到的東西整理出來,不僅僅當作自己的筆記,也用來給需要的人參考!😉

開發一個網站專案,特別是大型專案,不再只能像以前一樣用簡單的 HTML、CSS、JS 與圖檔等元素就可以達成,這樣開發效率非常差,且開發出來的網站也難以維護,因此就需要套件工具的輔助來達成優化、好維護、減少需求量、壓縮、SASS 編譯等前端需要用到的技術與功能,所以我們就從安裝出發吧!

Node.js 是一個能夠在伺服器端運行 JavaScript、開放原始碼且跨平台執行環境,旗下官方預設的套件管理程式npm,因此安裝完成 Node.js 代表 npm 也安裝完成啦!不過 npm 有安裝太慢且無快取機制等令人詬病的問題,因此 Facebook 推出的 Yarn 這款新的套件管理程式便大受歡迎啦!因為它有同時安裝多個套件的功能,且曾經下載過的套件無需要再次下載,因為其有快取機制,網路有任何錯誤都會及時重新連線,扁平模式可以將不一致的套件版本解析為單一版本以避免建立重複內容。使用套件管理程式一定要學終端機(命令提示字元)的使用,首先請先學會開啟它,左下角搜尋「cmd」即可開啟,安裝方面只會用其來檢查是否安裝成功,之後會非常頻繁使用到它。

本文以 Windows 環境實際安裝示範!接著我們要使用「Node.js」官方提供的安裝檔進行安裝,也等於將 npm 安裝好!

▲請先進入「Node.js」官方網站,選擇 LTS 版本並下載安裝檔。

▲打開「Node.js」安裝檔,依照上圖步驟安裝。

▲依照上圖指示安裝完成「Node.js」,接著開啟終端機(命令提示字元),輸入指令npm version查看版本,若顯示版本代表安裝成功。

▲接著到「Yarn」官方網站,選「安裝 YARN」。(官網支援繁體中文)

▲確認下載版本為穩定版本,接著點「下載安裝程式」。

▲一樣跟著上圖安裝步驟安裝 Yarn。

▲安裝完畢後開啟終端機(命令提示字元)打指令yarn version,若有顯示版本號代表安裝成功!

現在電腦裡已經安裝好 Node.js 啦!也安裝好兩個套件管理程式了!基本上我會比較推薦使用 Yarn 來安裝套件,速度比較快,下一篇來介紹如何使用 Yarn 創建一個專案!下篇見!👍

《下一篇:Windows 環境安裝 Node.js 以及 npm & Yarn 兩款熱門 JavaScript 套件管理程式》

Node.js 系列教學文章

贊助廣告 ‧ Sponsor advertisements

留言區 / Comments

萌芽論壇