1 安装vue-router

npm install vue-router@4.0.14

安装完成

2 在创建文件index.js;目录为 src/router/index.js

创建src/router/index.js文件

src/router/index.js 文件内容

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

const routerHistory = createWebHistory();
// createWebHashHistory hash 路由
// createWebHistory history 路由
// createMemoryHistory 带缓存 history 路由
const router = createRouter({
  history: routerHistory,
  routes: [
  
    {
      path: "/",
      component: () => import("@/pages/Home.vue"),
    },
    {
        path: "/about",
        component: () => import("@/pages/about/index.vue"),
      },
  ],
});

export default router;

下面是设置@ 为对应路径src

添加内容

vite.config.js添加内容

const { resolve } = require("path");


resolve: {
    alias: {
      "@": resolve(__dirname, "src"), // 设置 `@` 指向 `src` 目录
    },
  },

如有问题请留言哦，希望能帮到你哦