【创建vue3.0 加vite 加 pinia 加 router 项目详细步骤】

在开始创建vue3.0 + vite + pinia + router项目之前，请确保您已安装了npm。下面是详细步骤：

1. 全局安装vite

npm install -g vite

2. 创建vue3.0项目

npm init vite@latest project-name

在安装过程中，您将被要求选择所需的特性集。确保选择Vue作为框架选项，并将管理状态的选项设置为Pinia。

3. 安装Pinia

npm install pinia

4. 创建路由

npm install vue-router@4

创建一个名为router.js的文件，并添加以下内容：

import { createRouter, createWebHashHistory } from 'vue-router'
import Home from './views/Home.vue'

const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  }
]

const router = createRouter({
  history: createWebHashHistory(),
  routes
})

export default router

5. 引入Pinia和路由

在main.js中添加以下内容：

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import { createPinia } from 'pinia'

const app = createApp(App)

app.use(createPinia())
app.use(router)

app.mount('#app')

6. 运行项目

npm run dev

现在，您已经成功创建了一个使用Vue3.0和Vite的项目，并且集成了Pinia和路由。