vue3安装router报错

### Vue 3 安装 Router 报错解决方案

对于在 Vue 3 中安装 `vue-router` 遇到的错误，特别是当出现类似于 `TypeError: s.then is not a function at vue-router.mjs:2104:52` 的报错时，这通常是因为路由配置中的组件引入方式存在问题。

#### 错误原因分析
该类型的错误可能源于使用了异步组件定义方法不当。如果在路由器配置文件中以 `{ path: "xxxx", component: () => import('...') }` 或者类似的箭头函数形式来声明组件，则可能会触发上述异常情况[^2]。

#### 正确做法
为了修正此问题，在定义路径对应的视图组件时应直接指定已导入的模块名而不是返回一个立即执行表达式的箭头函数：

// 不推荐的做法
const routes = [
  {
    path: '/about',
    component: () => import('@/views/About.vue')
  }
]

// 推荐的做法
import About from '@/views/About.vue'

const routes = [
  {
    path: '/about',
    name: 'About',
    component: About,
  },
];

通过这种方式可以有效避免因加载机制不同而引起的兼容性问题以及潜在的运行时错误。

另外需要注意的是确保所使用的 `vue-router` 版本与当前项目的 Vue 版本相匹配。对于 Vue 3 应选用最新版的 `vue-router` 而不是旧版本如 v3.x系列，因为后者仅适用于 Vue 2.x项目环境[^1]。