vue项目中 页面组件懒加载 使用webpackChunkNmae
【摘要】
在路由中使用
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
来实现组件的懒加载 这种配置会生产一个about.[...
在路由中使用
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
来实现组件的懒加载 这种配置会生产一个about.[hash].js
对于优化首屏很有帮助， 但对于内部页面会有一点损失，比较资源不会一次加载到位的。
const routes = [
{
path: '/',
name: 'Home',
component: Home
},
{
path: '/about',
name: 'About',
// route level code-splitting
// this generates a separate chunk (about.[hash].js) for this route
// which is lazy-loaded when the route is visited.
component: () => import(/* webpackChunkName: "about" */ '../views/About.vue')
}
]
在开发时可以有选择性地懒加载，全部加载。 这个属于是router级别的代码分割。
文章来源: fizzz.blog.csdn.net，作者：拿我格子衫来，版权归原作者所有，如需转载，请联系作者。
原文链接：fizzz.blog.csdn.net/article/details/104712227
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
作者其他文章
评论（0）