路由懒加载

当打包构建应用时,JavaScript 包会变得非常大,影响页面加载。

如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。

使用了懒加载

javascript 复制代码
   export default [ {
        path: '/search/:keyword?',
        component: () =>import('@/pages/Search/index'),
        meta: { showHeader: true, showFooter: true },
        name: 'search'
    }, 
    {
        path: '/login',
        component: () =>import('@/pages/Login/index'),
        meta: { showHeader: false, showFooter: false }
    },]

不使用懒加载

javascript 复制代码
import Login from '@/view/Login'
export default [

     {
        path: '/login',
        component: () =>import('@/pages/Login/index'),
        meta: { showHeader: false, showFooter: false }
    },
]
相关推荐
程序员小寒2 小时前
JavaScript设计模式(八):命令模式实现与应用
前端·javascript·设计模式·ecmascript·命令模式
wgod2 小时前
new AbortController()
前端
UXbot2 小时前
UXbot 是什么?一句指令生成完整应用的 AI 工具
前端·ai·交互·个人开发·ai编程·原型模式·ux
棒棒的唐2 小时前
WSL2用npm安装的openclaw,无法正常使用openclaw gateway start启动服务的问题
前端·npm·gateway
哔哩哔哩技术2 小时前
使用Compose Navigation3进行屏幕适配
前端
咬人喵喵3 小时前
E2.COOL 平台深度解析:从特效分类到实战操作指南
前端·编辑器·svg
RisunJan4 小时前
Linux命令-named-checkzone
linux·前端
小陈工4 小时前
Python Web开发入门(十):数据库迁移与版本管理——让数据库变更可控可回滚
前端·数据库·人工智能·python·sql·云原生·架构
吹晚风吧4 小时前
解决vite打包,base配置前缀,nginx的dist包找不到资源
服务器·前端·nginx
weixin199701080165 小时前
《施耐德商品详情页前端性能优化实战》
前端·性能优化