iT邦幫忙

2025 iThome 鐵人賽

DAY 4
1

好的今天來介紹一下怎麼安裝vue.js。
我本身已經安裝好VSCode跟Node.js以及npm,所以這裡直接跳到安裝vue.js的部分,各位如果還沒安裝VSCode和Node.js的話,網路上有許多教學資源,iT邦幫忙上也有許多前輩們分享的相關文章,可以多加參考,各位加油~

好的,第一步打開我們的終端機,並將下列命令一行一行貼上去,來確認一下我們的Node.js跟npm是否都安裝完成了

node -v
npm -v

如果有出現版本號則代表安裝完成
https://ithelp.ithome.com.tw/upload/images/20250916/201786907hUOcKeqpm.png
接著我們來創建一個新專案並安裝vue.js,請在終端機執行下列命令
npm create vue@lastest
執行後會引導你輸入新專案名稱並選擇模板,是否需要路由、狀態管理等等
這裡會問你是否選用TypeScript( TypeScript 就是加了型別檢查的 JavaScript,它能幫助你在寫程式時就找出錯誤,讓程式碼更穩固且好維護。),我本身還沒學過TypeScript所以先選否

建立完專案後,執行下列命令進入專案資料夾

cd 你的專案名稱

安裝需要的套件

npm install

啟動伺服器

npm run dev

接著會看到以下畫面
https://ithelp.ithome.com.tw/upload/images/20250916/20178690pWGf0n9VqJ.png
網址通常會是 http://localhost:5173 ,透過該網址可以預覽你的vue專案

然後在終端機輸入下列命令就能在VSCode打開專案

code .

(記得在code跟 . 之間加入空格建,不然可能無法識別喔)


好的到這裡基本上就安裝好vue.js了,恭喜大家!
今天先到這部分,各位明天見~


上一篇
認識vue.js(下)
系列文
從零開始的Vue之旅4
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言