为什么在router文件夹下的index.js文件里面，一开始的时候需要注册VueRouter？

Question

为什么在router文件夹下的index.js文件里面，一开始的时候需要注册VueRouter？

import Vue from "vue";
import VueRouter from "vue-router";
// 为什么需要在这里注册一次VueRouter？
Vue.use(VueRouter);

最后不是会把router实例对象export出去然后在main.js里面Vue.use(router)吗？
为什么要注册两次？

Answer 1

怎么感觉你是把 Vue2 跟 Vue3 的两处 use 的写法给混在一起了呢……

Vue2 里：

Vue.use(VueRouter); // 全局的 use

const router = new VueRouter();
new Vue({ router });

Vue3 里：

const router = createRouter();
createApp().use(router); // 实例的 use

都是只有一次 use，为啥会有两次？

---

P.S. 2 里的 use 是全局的，所有 Vue 实例都注入了 VueRouter（但它们可以使用不同的配置项）；3 里 use 是单个实例的，每个 Vue 实例可以自己决定是否注入 VueRouter。

Answer 2

不是只需要在 router/index.js 里面注册一次就可以了吗，然后再在 main.js 中实例化 Vue 的时候挂载一下 router 就好了。

不需要使用 Vue.use() 注册两次啊。你把 main.js 里面的 Vue.use(router) 删了，只是保留 router/index.js 里面的 Vue.use 也是可以的。

不过注册放到 router/index.js 里面是为了统一，就看个人的开发习惯了。你也可以单纯只是在 router/index.js 里面维护路由表和守卫，然后在 main.js 中 import 然后注册和挂载 vue-router

---

Edit

使用 Vue.use() 注册 和 在Vue实例中挂载都是为了整个应用都有路由功能。可以在Vue的文档中看到这部分的内容 👉 插件 — Vue.js 2.x
Vue2中需要单独又重新挂载是为了在业务中可以使用 this.router/this.route 去使用 vue-router，这部分可以在 起步 | Vue Router 3.x 中看到。

通过注入路由器，我们可以在任何组件内通过 this.$router 访问路由器，也可以通过 this.$route 访问当前路由

这是在Vue2中的使用方法，在Vue3中就不需要重新挂载在实例上了，直接使用 Use 注册就可以了 👉 入门 | Vue Router 4.x
应该是新的 .use() 方法帮助我们做了这个操作 👉 插件 | Vue.js 3.x

一个插件可以是一个拥有 install() 方法的对象，也可以直接是一个安装函数本身。安装函数会接收到安装它的应用实例和传递给 app.use() 的额外选项作为参数：

Answer 3

第一次注册是为了让 Vue 应用能够使用 Vue Router 的功能，第二次注册是告诉应用使用哪个具体的路由器实例来管理路由。