vue3+vite配置静态路由

1. 安装路由

npm install vue-router --save

2. 新建router/index.js文件

        文件内容

import {
  createRouter,
  createWebHistory
} from 'vue-router'


import Home from '../view/home.vue'

const routes = [{
  path: "/",
  name: "index",
  redirect:"/home", //这个得加上，否则路由不会转到home，home页面无法显示
  component: () => import('../app.vue'),
  children: [{
    path: '/home',
    name: 'Home',
    component: Home,
  }, ]
}]


const router = createRouter({
  history: createWebHistory(),
  routes
})
console.log(router)
export default router

3. mian.js配置

import router from './router'

createApp(App).use(router).mount("#app")

4. app.vue配置

添加路由入口

<template>
    <router-view />
</template>