Vue Router通过install方法将单例路由实例全局注入，确保所有组件共享同一状态，实现响应式路由、守卫统一调度与路径同步，避免重复创建导致的状态割裂和性能浪费。
因为路由实例是全局单例，通过 install 方法一次性注入 Vue 应用上下文，所有组件共享同一份实例，无需重复创建。
路由复用本质是共享一个实例
Vue Router 的核心设计就是“一份路由配置、一个路由实例、全应用共用”。当你调用 createRouter(options)，得到的是一个独立的、状态完整的路由管理器（含当前 route、history、matcher 等）。这个实例在 app.use(router) 时被挂载到整个应用，后续所有组件访问的 $router 和 $route 都指向它内部的响应式数据。
这和手动在每个组件里 const router = createRouter(...) 完全不同——后者会创建多个互不通信、状态割裂的路由对象，破坏导航一致性、守卫执行顺序、滚动行为等关键能力。
install 方法做了三件关键事
install 不是魔法，而是标准化的“全局能力注入协议”。以 Vue 3 的插件为例，它的执行逻辑清晰明确：
开箱即用的技能链路由引擎。13 条预定义链覆盖搜索、开发、审查、MLOps、法律、创意等场景，三层路由架构（触发词→SAD反馈→DAG编排），recall@10=96.97%。配置驱动（chains.yaml），零代码扩展。pip install skill-weave-chains 一键安装。
- 接收
app实例（即应用上下文），确保操作作用于整个应用生命周期 - 调用
app.config.globalProperties或app.provide注入$router、$route，让所有组件实例都能访问 - 使用
app.mixin注入beforeCreate钩子，在组件初始化前自动绑定路由实例（如判断this.$options.router并赋值） - 可选：注册全局组件（如
RouterLink、RouterView）、指令或工具方法
为什么不能靠 import + new 来替代？
单纯 import { createRouter } from 'vue-router' 再在组件中调用，会遇到几个硬性问题：
-
响应式丢失：每个组件拿到的都是新实例，无法响应式监听
route变化，useRoute()将失效 - 守卫不生效：全局前置/后置守卫、路由独享守卫都依赖统一的 router 实例调度，分散实例无法触发
-
状态不同步：比如一个组件调用
router.push()，另一个组件无法感知当前路径变更，$route.fullPath值永远滞后 - 内存与性能浪费：重复解析路由表、重建 matcher、初始化 history 模式，违背单页应用的设计初衷
对比 Vuex 的 install 逻辑，本质一致
Vuex 的 install 同样把 store 挂到 app.config.globalProperties.$store，并配合 app.provide('store', store) 支持组合式 API 的 useStore()。它和 Vue Router 的差异只在于注入的对象不同，底层机制完全相同：通过插件系统实现一次安装、处处可用、状态唯一。
这种设计不是 Vue 的限制，而是刻意为之的架构约束——强制开发者面向“应用级状态”编程，而非“组件级副本”编程。
