在 Windows 子系統 Linux 版上安裝 Vue.js
協助您在 Windows 上設定 Vue.js 開發環境的指南,方法是在 Windows 子系統 Linux 版 (WSL) 上安裝 Vue.js Web 架構。 在 Vue.js 概觀頁面上深入了解。
Vue 可以直接在 Windows 上或 WSL 上安裝。 如果您計劃與 NodeJS 後端互動、想要與 Linux 實際執行伺服器同位,或計劃遵循使用 Bash 命令的教學課程,通常建議您在 WSL 上安裝。 您也可以考慮將 Vite 視為Vue.js的替代方案。
必要條件
- 安裝 Windows 子系統 Linux 版 (WSL),包括 Linux 發行版本 (例如 Ubuntu),並確定它以 WSL 2 模式執行。 可開啟 PowerShell 並輸入下列內容,以此方式進行檢查:
wsl -l -v
- 在 WSL 2 上安裝 Node.js:這包括版本管理員、封裝管理員、Visual Studio Code 和遠端開發延伸模組。 Node Package Manager (npm) 會用來安裝 Vue.js。
重要
使用 WSL 安裝 Linux 發行版本將會建立用來儲存檔案的目錄:\\wsl\Ubuntu-20.04
(將 Ubuntu-20.04 取代為您使用的任何 Linux 發行版本)。 若要在 Windows 檔案總管中開啟此目錄,請開啟 WSL 命令列,使用 cd ~
選取您的主目錄,然後輸入 explorer.exe .
。請勿在掛接的 C 磁碟機 (/mnt/c/Users/yourname$
) 上安裝或儲存您將使用的檔案。 這樣做會大幅降低安裝和建置時間的速度。
安裝 Vue.js
若要在 WSL 上安裝 Vue.js:
開啟 WSL 命令列 (即 Ubuntu)。
建立新的專案資料夾:
mkdir VueProjects
,並進入該目錄:cd VueProjects
。使用 Node Package Manager (npm) 安裝 Vue.js:
npm install vue
使用 vue --version
命令檢查您已安裝的版本號碼。
注意
若要使用 CDN 來安裝 Vue.js,而不是 NPM,請參閱 Vue.js 安裝文件。
安裝 Vue CLI
Vue CLI 是一個工具組,可讓您在終端/命令列中使用 Vue。 它可讓您快速建立新專案 (vue create)、製作新想法的原型 (vue serve),或使用圖形化使用者介面 (vue ui) 管理專案。 Vue CLI 是全域安裝的 npm 套件,可為您處理某些組建複雜度 (例如使用 Babel 或 Webpack)。 如果您不是要建置新的單頁應用程式,可能不需要或想要 Vue CLI。
若要安裝 Vue CLI,請使用 npm。 您必須使用 -g
旗標來全域安裝,才能升級 (vue upgrade --next
):
npm install -g @vue/cli
若要深入了解可新增的其他外掛程式 (例如 linting 或 Apollo 用於整合 GraphQL),請瀏覽 Vue CLI 文件中的 Vue CLI 外掛程式。
其他資源
- Vue 文件
- Vue.js 概觀
- 在 Windows 上安裝 Vue.js
- 安裝 Nuxt.js
- Microsoft Learn 線上課程:使用 Vue.js 邁出第一步
- 嘗試使用 VS Code 的 Vue 教學課程