vite+vue3中使用router

用vue3官方推荐的构建工具vite创建vue3项目的时候,项目中是没有像vue-cli一样可以默认引入路由的,这就很难受了,对于我这种习惯vue-cli配置好的人来说,有点不习惯。

下面我们就手动引入路由。

npm下载vue3对应的路由,注意的是vue3默认使用的是4.0+版本的路由,vue2中是不支持的,我们直接下载最新版本的router

npm i vue-router -S

接下来在src目录下建立个router文件夹,router文件夹下新建index.ts文件(我这里使用的是ts,js也一样)

 在index.ts中写如下代码

import { createRouter, createWebHistory } from "vue-router";
import home from "../view/Home.vue";
const routes:any = [
    {
        path: '/',
        component: home
    },
]

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

export default router

然后main.ts文件中导入router,并全局使用