首先我们下载安装router，less / scss，pinia，axios， element / Ant Design Vue，Echarts 以及如何配置@别名，自定义组件

npm

npm create vite@latest 

yarn

 yarn create vite

然后安装依赖

成功后 

在src下创建一个 routes 文件夹，再创建一个 index.ts 文件  

 import { createRouter, createWebHistory } from "vue-router";let routes= [{path: '/',name: 'home',//使用import可以路由懒加载，如果不使用，太多组件一起加载会造成白屏component: () => import('../view/homeView.vue')},//{//配置404页面//path: '/:catchAll(.*)',//name: '404',//component: () => import(''),//}
]
// 路由
const router = createRouter({history: createWebHistory(),routes
})
// 导出
export default router 

路由等 main.js

引入

import { createApp } from 'vue'
import App from './App.vue'//routesimport router from "./routes/index"; const app= createApp(App)//routes app.use(router)  
app.mount('#app')

一开始 app.vue是默认呈现页面所有，如果在其他路由写东西不会呈现出来，除非app.vue引入标签 创建引入路由