vue 3 配置 vue router 的核心三步是：安装 vue-router@4、创建 router/index.js 并导出 createrouter 实例、在 main.js 中通过 app.use(router) 挂载并在 app.vue 中添加 。
Vue 3 项目初始化时配置 Vue Router，核心就三步：装对版本、写好路由配置文件、在应用中正确挂载。关键不是“能不能配”，而是“别踩版本和写法的坑”。
必须安装 Vue Router 4
Vue 3 只兼容 Vue Router 4，装错版本会导致 createRouter 找不到、useRouter 报错等基础问题。
- 用 npm：运行
npm install vue-router@4 - 用 yarn：运行
yarn add vue-router@4 - 装完立刻检查
package.json中"vue-router"字段，确认版本号是^4.x.x（如^4.4.5），不是^3.x.x或没带@4
创建 router/index.js 配置文件
在 src 下新建 router 文件夹，再建 index.js（或 index.ts）：
- 导入
createRouter和createWebHistory（推荐 History 模式，URL 干净；若开发期不想配服务器，可用createWebHashHistory） - 导入页面组件，例如
HomeView.vue、AboutView.vue - 定义
routes数组，每个对象含path、name（建议加，方便编程式导航）、component - 调用
createRouter创建实例，传入history和routes - 导出默认实例：
export default router
示例代码片段：
vue-composition-api-best-practices
Vue 3 组合式 API 与
热门下载
相关下载
精品课程
相关推荐
/
热门推荐
/
最新课程
最新文章