“export ‘default‘ (imported as ‘VueRouter‘) was not found in ‘vue-router‘报错分析

在项目运行时会报错“export ‘default‘ (imported as ‘VueRouter‘) was not found in
‘vue-router‘` 主要是路由组件问题

一、错误分析

有以下两种原因：

1.路由格式编写错误

错误格式

router: [{
    
            //应该是 routes
                // 路径的错误
                path: '/home',
                // 组件名不是字符串格式  component而不是components
                components: "home"
            },

正确格式

routes: [{
    
    
                // 路径
                path: '/home',
                // 组件名
                component: Home
            },

2.对应版本不兼容

这是因为安装的时候默认安装最新版本可能与其他插件不兼容，重新安装旧版本即可，推荐使用稳定版本[email protected]

二、举一反三

1.查看依赖版本号

• 可以在package.json文件里查看vue或者vue-cli或者vue-router等等所有依赖的版本号
• 也可以通过npm list vue || npm list vue -g命令查看

2.下载或者卸载已有版本

   卸载：npm uninstall vue-router
   下载：npm install vue-router@3.5.2    //   @xxx 自己指定版本

3.一些兼容问题

• Vue CLI 4.5以下，对应的是Vue2
• Vue CLI 4.5及以上，对应的是Vue3，也可以手动选择Vue2 vue
• 3.0以下兼容的是element-ui前端组件库;
• vue 3.0兼容的是element-plus前端组件库.
• vue2搭配vue-router3
• vue3搭配vue-router4
  更多相关内容点击这里