创建 vue3 + vite

要创建Vue3 + Vite项目，您需要先安装Node.js和npm。然后，按照以下步骤进行操作：

1. 安装Vue CLI：

npm install -g @vue/cli

2. 使用Vue CLI创建项目：

vue create my-project

3. 选择“Manually select features”选项来手动选择您需要使用的特性。选择“Babel”、“Router”、“Vuex”和“CSS Pre-processors”。

4. 选择“CSS Pre-processors”时，选择“Sass/SCSS (with dart-sass)”选项。

5. 等待安装完成后，进入项目目录：

cd my-project

6. 安装Vite：

npm install vite --save-dev

7. 在package.json文件中添加以下脚本：

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

8. 创建一个main.js文件，以便在其中编写Vue代码：

import { createApp } from 'vue'
import App from './App.vue'

createApp(App).mount('#app')

9. 在App.vue文件中编写Vue模板代码：

<template>
  <div>
    <h1>{{ greeting }}</h1>
  </div>
</template>

<script>
export default {
  data() {
    return {
      greeting: 'Hello Vue3 + Vite!'
    }
  }
}
</script>

10. 运行开发服务器：

npm run dev

11. 在浏览器中打开http://localhost:3000/，您应该能够看到“Hello Vue3 + Vite!”的欢迎消息。

现在，您已经成功地创建了一个Vue3 + Vite项目！