Vite 官方文檔： **** 下面演示創建一個名為`learn-vue3-vite`項目，步驟如下： **1. 創建項目** ```shell ## 創建項目 > npm create vite@latest * ? Project name: learn-vue3-vite --輸入項目名 * ? Selecta framework: * vue --選中vue ? Select a variant: * vue-ts --選擇vue-ts ## 然后就創建了 learn-vue3-vite 項目 Scaffolding project in D:\vue3_\learn-vue3-vite... Done. Now run: cd learn-vue3-vite npm install npm run dev ``` **2. 啟動項目** ```shell > cd learn-vue3-vite > npm install > npm run dev ``` 訪問 http://localhost:3000/ 看到下面頁面說明項目創建并啟動成功了。  **3. 項目目錄介紹** ``` |—— projectName | |—— .vscode | |—— node_modules #npm加載的項目依賴模塊 | |—— public #公共資源目錄 | | |—— favicon.ico | |—— src #我們要開發的目錄，基本上要做的事情都在這個目錄里 | | |—— assets #放置一些圖片，如logo等 | | | |—— logo.png | | |—— components #目錄里面放了一個組件文件，可以不用 | | | |—— HelloWorld.vue | | |—— App.vue #項目入口文件 | | |—— env.d.ts | | |—— main.ts #項目的核心文件 | |—— .gitignore | |—— index.html #首頁入口文件，你可以添加一些 meta 信息或統計代碼啥的 | |—— package-lock.json | |—— .babel.config.js | |—— package.json #項目配置文件 | |—— README.md #項目的說明文檔，markdown 格式 | |—— tsconfig.json | |—— tsconfig.node.json | |—— vue.config.ts ```