Java登陸第三十四天——使用Vite建立工程化的Vue3專案

Vue

Vue是基於標準 HTML、CSS 和 JavaScript 構建的前端框架，可以更高效地開發前端頁面。

Vite

Vite是Vue團隊開發的專案管理工具。

• Maven的主要功能
  1. 引入依賴
  2. 專案管理

使用Maven可以工程化的管理後端程式碼。

• npm的主要功能：引入依賴

• vite的主要功能：專案管理

使用npm+vite就可以和maven一樣，更加工程化前端專案。

Vite建立Vue3工程化專案

在合適的磁碟檔案中，使用命令

• npm create vite

該命令就是使用vite建立專案了。(具體什麼專案需要手動選擇)

第一次使用時會提示下載vite，輸入y同意即可。

專案初始化結構。

檢視package.json。

安裝依賴

注意此時專案並沒有下載依賴。

需執行npm i命令，安裝專案依賴。

啟動專案

初始自帶三個指令碼。

  "scripts": {
    "dev": "vite",
    "build": "vite build",
    "preview": "vite preview"
  }

• npm run dev啟動專案

Ctrl+c強制退出可關閉專案。