vue路由按需加载

最新推荐文章于 2025-10-30 12:51:28 发布

原创最新推荐文章于 2025-10-30 12:51:28 发布 · 181 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue #路由 #按需加载

vue 专栏收录该内容

10 篇文章

订阅专栏

在vue中路由过多的话会让用户体验变得极差，加载时时间过长，使用这种方式配置的话会按需加载，以此提高性能

const test1 = ()=>import('@/components/test1.vue') 
const test2 = ()=>import('@/components/test2.vue')

//指定了相同的webpackChunkName，会合并打包成y一个js文件，在路径之前加   /* webpackChunkName:'grounpTest' */
const test3 = ()=>import(/* webpackChunkName:'grounpTest' */ '@/components/test3.vue') 
const test4 = ()=>import(/* webpackChunkName:'grounpTest' */ '@/components/test4.vue')

const router = new VueRouter({
    routes: [
        { path: '/test1', component: test1 },
        { path: '/test2', component: test2 },
        { path: '/test3', component: test3 },
        { path: '/test4', component: test4 }
    ]
 })