0

我正在从vue-clito迁移vite，我的路由器打破了页面。

TypeError: class constructors must be invoked with 'new'
    extractComponentsGuards vue-router.esm-bundler.js:2017
    navigate vue-router.esm-bundler.js:3136
    promise callback*navigate vue-router.esm-bundler.js:3131
    pushWithRedirect vue-router.esm-bundler.js:3026
    push vue-router.esm-bundler.js:2962
    install vue-router.esm-bundler.js:3376
    use runtime-core.esm-bundler.js:3809
    <anonymous> main.ts:5

我使用 vue-cli 创建了我的项目并安装了 vue-router4 以尝试将我以前的入门项目与 vue-cli 匹配。

我main.ts的很简单：

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

createApp(App).use(router).mount('#app');

我router/index.ts也是：

import { createRouter, createWebHistory, RouteRecordRaw } from 'vue-router';
import Home from '@/views/Home.vue';

const routes: Array<RouteRecordRaw> = [
  {
    path: '/',
    name: 'Home',
    component: Home,
    children: [{
      path: 'choice',
      name: 'Choice',
      component: () => import('../components/Choice.vue'),
    }],
  },
];

const router = createRouter({
  history: createWebHistory(import.meta.env.BASE_URL),
  routes,
});

export default router;

tsconfig.json如果我错过了什么，这是我的：

{
  "compilerOptions": {
    "target": "esnext",
    "useDefineForClassFields": true,
    "module": "esnext",
    "moduleResolution": "node",
    "strict": true,
    "jsx": "preserve",
    "allowSyntheticDefaultImports": true,
    "sourceMap": true,
    "resolveJsonModule": true,
    "esModuleInterop": true,
    "lib": ["esnext", "dom"],
    "types": ["node"],
    "isolatedModules": true,
    "skipLibCheck": true
  },
  "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"],
  "exclude": ["node_modules"]
}

我从 Vue3 和 vue-router4 开始，所以欢迎任何线索或线索！

谢谢

4

0 回答 0