vue-router 路由懒加载

561 阅读1分钟

报错信息

[Vue warn]: Failed to mount component: template or render function not defined. (found in root instance)

错误

如果你在配置 vue-router 懒加载的时候碰到以上报错,那么你这部分路由一定是这样写的:

routes: [
    {
        path: '/foo',
        component: () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')
    }
]

正确

如官方文档所示,懒加载时应先创建变量,再去对路由对象进行赋值:

const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')

routes: [
    {
        path: '/foo',
        component: Foo
    }
]