【Vue3】之vue-router的安装与配置

安装

yarn add vue-router@4.*
或
npm install -save vue-router@4.*

创建

新建router.js
router.js

import {
    
     createRouter,createWebHistory} from "vue-router";

const routes = [
    {
    
     path: "/", redirect: "/home" },
    {
    
    
        path: "/home",
        name: "home",
        component: () => import("../views/home.vue")
    },
    {
    
    
        path: "/login",
        name: "login",
        component: () => import("../views/login.vue")
    }
]

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

export default router;

引入

App.vue

import {
    
     createApp } from 'vue'
import App from './App.vue'
import './index.css'
import router from './router'

const app = createApp(App)
app.use(router)
app.mount('#app')