vue3创建新项目运行浏览器报错：Uncaught TypeError: Cannot read property ‘use‘ of undefined

当时的报错信息如下：

​

 

在路由文件中使用Vue.use(router)的语句无法正常启动服务，并且浏览器报错，提示‘use’并未定义，vue中没有use（）这个方法。

经过查找资料后发现，这种加载vue-router的方式是vue2使用的，但我现在用的是vue3，我现在需要使用vue3的方式来导入vue-router。

首先，在路由文件里，我们已经不再需要通过下面这三句程序来导入vue-router了,下面这三句话要删掉：

 

​import Router from 'vue-router'

import Vue from 'vue'
 
Vue.use(Router)

​​​

然后，再加入一下代码：
​

import {createRouter, createWebHistory} from 'vue-router'
 
const routerHistory = createWebHistory()
 
const router = createRouter({
    history: routerHistory,
     /*
      *   在这里和vue2一样写路由配置
     */
}

​​​

​然后还需要在main.js里作路由导入：
​

import { createApp } from 'vue'
import App from './App.vue'
import router from './router/index'

const app = createApp(App)
app.use(router)
app.mount('#app')

​​​

​到现在vue3关于vue-router的导入已经完成了，到这里运行项目就成功了。如果运行项目时仍然会报错，提示下图中的createWebHistory不是一个function；
查看了vue-router源文件后发现并没有我们所需要导入的两个方法。这个时候的话就可以往vue-router版本方面的问题去考虑，看看是不是vue-router的版本不对，
根据找到的资料来看，需要4.0以上的版本才能适配，所以通过下面的命令安装了v4的vue-router。

​

npm install vue-router@4

 最后项目成功运行。更详细的参考链接请点这里。感谢！

 

声明：此文章为个人学习之用，如与其他作品雷同，纯属巧合，并请明示指出

​

​​​