1. 要建立一個新的VUE項目，請使用Vue CLI或Vite，由於其速度和現(xiàn)代工具，Vite是大多數新項目的推薦選擇。 2。對於Vue CLI，使用NPM install -G @vue/cli在全球安裝它，使用VUE Create My-Vue-App創(chuàng)建一個項目，選擇所需的功能，例如VUE 3，Router Router和Eslint，然後使用NPM Run Serve運行該項目，使其在http：// local-Host：// local-Host：8080。 3。對於Vite，使用NPM Create vite@最新my-vue-app創(chuàng)建一個項目 - -Template Vue，使用NPM安裝安裝依賴項，然後使用NPM Run Dev啟動Dev Server，通常在http：// localhost：5173。 4。關鍵差異包括使用WebPack進行較慢的啟動和更多配置選項的VUE CLI，而Vite則使用本機ES模塊用於更快的啟動和近乎固有的HMR，通過vite.config.js更簡單的配置，現(xiàn)在是官方Vue文檔中的默認值。 5。選擇VUE CLI進行結構化學習或遺產集成，但使用Vite進行更快的開發(fā)和現(xiàn)代工作流程，因為它為新項目提供了更平滑的體驗，除非需要特定的VUE CLI功能。

無論您使用VUE CLI還是VITE，設置新的VUE項目都很簡單。兩種工具都被廣泛使用，但它們的速度，配置和現(xiàn)代功能有所不同。這是開始的方法。

選項1：使用VUE CLI（非常適合初學者和完整的Vue生態(tài)系統(tǒng)）

Vue CLI是Vue.js的官方命令行工具。它提供了一個功能齊全的設置，並具有內置的路由，狀態(tài)管理和測試的選項。

步驟1：全球安裝Vue CLI

確保已安裝了Node.js（v16.0或更高），然後運行：

 npm install -G @vue/cli

您可以使用以下方式驗證安裝

vue- version

步驟2：創(chuàng)建一個新項目

運行以下命令並按照提示：

 Vue創(chuàng)建my-vue-app

您會被要求選擇一個預設：

• 默認值（VUE 3）或默認值（VUE 2） - 適用於快速啟動。
• 手動選擇功能- 讓您添加Vue路由器，Vuex，Typescript，Eslint等。

例如，將VUE 3與路由器和Eslint一起使用：

• 選擇： Choose Vue version ， Babel ， Router ， Vuex ， CSS Pre-processors ， Linter / Formatter
• 提示時選擇VUE 3。

步驟3：運行項目

導航到項目文件夾並啟動Dev服務器：

 CD my-vue-app
NPM運行服務

您的應用將在http://localhost:8080提供。

選項2：使用VITE（更快，現(xiàn)代，推薦用於新項目）

Vite是下一代構建工具，可提供閃電般的啟動和HMR（熱模塊更換）。現(xiàn)在，這是啟動新VUE項目的推薦方法。

步驟1：用VUE創(chuàng)建一個Vite項目

運行此命令（無需全局安裝）：

 npm創(chuàng)建vite@最新my-vue-app  -  -template vue

或者，對於用打字稿進行VUE：

 npm創(chuàng)建vite@最新my-vue-app  -  -template vue-ts

這將創(chuàng)建一個名為my-vue-app的新文件夾，並使用最小的VUE設置。

步驟2：安裝依賴項

進入項目目錄並安裝依賴項：

 CD my-vue-app
NPM安裝

步驟3：啟動開發(fā)服務器

NPM運行開發(fā)

服務器通常會在http://localhost:5173 （端口可能會有所不同）。

關鍵差異：Vue Cli vs Vite

您應該使用哪個？

• 如果您使用結構化設置學習VUE，請使用VUE CLI ，需要與舊插件進行深入集成，或者需要引導配置。
• 如果您想更快地開發(fā)，正在啟動新項目或想要利用現(xiàn)代工具，請使用Vite 。

Vite現(xiàn)在是大多數VUE文檔和模板（包括官方VUE教程）中的默認選擇。

基本上，這兩種工具都可以很好地工作，但是Vite可以從開箱即用的速度上獲得更流暢，更快的體驗。對於大多數新項目，請使用Vite，除非您有VUE CLI更好地支持的特定需求。

以上是如何使用VUE CLI或VITE設置一個新的VUE項目的詳細內容。更多資訊請關注PHP中文網其他相關文章！