vue-router的配置

先下载

pnpm install vue-router

然后再src目录下创建一个router文件夹,里面建一个index.ts,router.ts然后我们就在index里面写一下代码

import {createRouter,createWebHistory}  from "vue-router";
import { constRouterRputes} from "./router"
const router  = createRouter({
     history:createWebHistory(),
     routes:constRouterRputes,
    //  滚动行为
     scrollBehavior(){
             return {
                  left:0,
                  top:0,
            }
     }
})
export  default router;

router.ts里面配置一下代码

export  const constRouterRputes = [
    {
        path:'/login',
        component:()=> import('@/views/login/index.vue'),
        name:'login'
    },
    {
        path:'/',
        component:()=>  import('@/views/home/index.vue'),
        name:'home'
    },
    {
        path:'/404',
        component: ()=> import('@/views/404/index.vue'),
        name:'404'
    },
    {
        path:'/:pathMatch(.*)*',
        redirect:'/404',
        name:'any',
    }
 ]

然后我们在main.ts里面配置一下代码,就是给app挂在

import router from "@/router/index.ts"