最常用且推荐的方式是在路由配置中为根路径 / 添加 redirect 字段，如 { path: '/', redirect: '/home' }，实现访问 / 时自动跳转至 /home 或其他默认页面，兼容 Vue 2 和 Vue 3。
Vue Router 设置路由重定向来实现默认页面，最常用也最推荐的方式是在路由配置中为根路径 / 添加 redirect 字段。它简单、明确、符合约定，且在 Vue 2 和 Vue 3（搭配 createRouter）中写法一致，只是 API 略有差异。
直接在根路径配置 redirect（最常用）
这是项目中最主流的做法：访问 / 时自动跳转到你指定的默认页，比如 /home 或 /dashboard。
- Vue 2 写法（基于
new Router）：
const routes = [
{ path: '/', redirect: '/home' },
{ path: '/home', name: 'Home', component: () => import('@/views/Home.vue') },
{ path: '/about', component: () => import('@/views/About.vue') }
];
```
- Vue 3 + Vite 写法（基于
createRouter）：
import { createRouter, createWebHistory } from 'vue-router'
const router = createRouter({
history: createWebHistory(),
routes: [
{ path: '/', redirect: '/home' },
{ path: '/home', name: 'Home', component: () => import('@/views/Home.vue') },
]
```
用户打开网站时，地址栏会从 / 变成 /home，并渲染对应组件。
用命名路由重定向（更健壮）
当目标路由已定义 name，建议用对象形式重定向。这样即使将来改了路径（比如把 /home 改成 /dashboard），只要 name: 'Home' 不变，根路径重定向依然有效，无需同步修改 redirect 字符串。
立即学习“前端免费学习笔记（深入）”；
开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。
{ path: '/', redirect: { name: 'Home' } }
```
注意：name 必须在目标路由中明确定义，否则会报错 “Named route 'xxx' has not been registered”。
捕获所有未匹配路径（兜底重定向）
除了根路径，通常还建议加一条通配规则，防止用户输入错误路径或旧链接失效：
```js{ path: '/:pathMatch(.*)*', redirect: '/' }
```
这条规则放在路由数组末尾，意思是：任何不匹配前面所有 path 的地址，都重定向回根路径（进而触发上面的 / → /home 跳转）。Vue 3 中使用 :pathMatch(.*)*，Vue 2 中对应写法是 * 或 /\*\/?。
不推荐：仅靠 path: '/' 配置组件（非重定向）
有人会直接写：
```js{ path: '/', component: Home }
```
这确实能让首页显示，但它不是“重定向”，而只是把 / 当作一个普通路由。问题在于：如果你后续想统一入口为 /home（比如 SEO 规范、权限控制、埋点统计），就得手动改所有地方；而且无法复用 name: 'Home' 的语义化优势。所以除非项目极小且无扩展需求，否则建议坚持用 redirect 方式。
