见文档https://vue-docs-next-zh-cn.netlify.app/guide/installation.html#%E5%91%BD%E4%BB%A4%E8%A1%8C%E5%B7%A5%E5%85%B7-cli
vite搭建：
1. 安装vite npm init @vitejs/app 2. npm init vite <project-name> 3. cd <project-name> 4. npm i 5. npm run dev
vite引入组件时需要加文件后缀不然报错
路由配置
下载路由： npm install vue-router@4
1. 新建router文件夹，其下建index.js
import {createRouter, createWebHashHistory, createWebHistory} from "vue-router"
const routes = [
{
path: "/",
component: () => import(‘../components/home.vue‘)
},
{
path: "/about",
component: () => import(‘../components/pages/about.vue‘)
},
];
const router = createRouter({
// 4. 采用hash 模式
history: createWebHashHistory(),
// 采用 history 模式 history: createWebHistory(),
routes,
});
export default router
2. 挂载到main.js
import { createApp } from ‘vue‘
import App from ‘./App.vue‘
import router from ‘./router/index‘
// createApp(App).mount(‘#app‘)
const app = createApp(App)
app.use(router)
app.mount(‘#app‘)