vue创建项目使用vue-router和vuex报错Object(...) is not a function

之前创建项目使用还好好的，这次想新建个项目练练手，才用了vue-router就报错了，记录下自己修改了一个下午的bug,泪目了（其实是版本问题，小小剧透）

报错：Object(...) is not a fuction

创建项目时用的是vue-cli3命令：vue create projectName
选择vue2：

main.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.config.productionTip = false

new Vue({
  render: h => h(App),
  router,
  store
}).$mount('#app')

router文件夹下的index.js

import  Vue  from 'vue'
import  VueRouter  from 'vue-router'

const testA = () => import('../views/testA.vue')
const testB = () => import('../views/testB.vue')
const testC = () => import('../views/testC.vue')

//1.安装插件
Vue.use(VueRouter);

//2.创建路由对象
const routes = [
  {
    path: '',
    redirect: '/testa'
  },
  {
    path: '/testa',
    component: testA
  },
  {
    path: '/testb',
    component: testB
  },
  {
    path: '/testc',
    component: testC
  }
]
const router = new VueRouter({
  routes,
  mode: 'history'
})

export default router

store文件夹下的index.js

import Vue from 'vue';
import Vuex from 'vuex'

Vue.use(Vuex);
const store = new Vuex.Store({
  state: {
  },
  mutations: {
  },
  actions: {
  }
})
export default store;

找bug:
一开始报错，百度了下，既然报错Object(…) is not a fuction，那肯定是那个函数或者啥写错拼错了，检查了一遍，就是没有错。又有的文章说是import引入没有加{},我给全部加上了，报错Cannot read properties of undefined (reading ‘use‘)。百思不得其解以为是创项目时使用的脚手架和语法有冲突，又重新创了几次项目。。。。这里查了创项目的文章vue-cli3中使用vue-router

真正的原因是vue-router，vuex和vue的版本不匹配。解决方法：卸载vue-router和vuex npm uninstall vue-router和npm uninstall vuex,安装匹配版本，我这里可以运行的版本是vue-router: “^3.5.2”, vuex: “^3.6.2”。输入命令npm install vue-router@3.5.2和npm install vuex@3.6.2,当然不是重新安装就完事儿了，重点是再输入npm install,然后bug就完美解决啦~

附上版本：