>Andy , 2024.12.24 # Vue的學習歷程EP1-初探Vue3 ## Outline 1. 前言 2. 安裝Node.js 3. 建立一個Vue專案 # 前言 自從決定專精後端，並且成為後端工程師之後，過了快兩年了，近來覺得純後端的職缺並沒有我想像中的多，一直鑽牛角尖的當後端工程師，好像只會讓自己的職涯越來越狹隘，所以決定認真的學習vue，往全端工程師邁進，並紀錄學習的過程。 # 安裝Node.js及Vue Cli ## 安裝Node.js 開始安裝Vue之前，要先安裝Node.js，並且版本要在8.11以上，不過現在已經到22.xx了，直接安裝最新版即可。 下載連結: https://nodejs.org/zh-tw/download/prebuilt-installer 確認是否安裝成功: 打開cmd後，輸入 ``` node -v ``` 就會取得版本號如下 ``` v22.12.0 ``` Node.js 22.12版本已內建npm，所以不用另外安裝，一樣透過cmd輸入指令查詢版本 ``` npm -v ``` 取得版本號如下 ``` 10.9.0 ``` # 建立一個Vue專案 開啟cmd輸入 ``` npm create vite@latest ``` 接著輸入專案名稱，並選擇框架、語言 我選了vue、Javascript 接著切換至專案資料夾，執行 ``` npm install ``` 完成後輸入 ``` npm run dev ``` 就可以開啟建置好的專案了 ![image](https://hackmd.io/_uploads/HJV0xCPBJl.png) ###### tags: `front-end`