zoukankan      html  css  js  c++  java
  • vue路由懒加载

    引用官网的一句话,当打包构建应用时,Javascript 包会变得非常大,影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块,然后当路由被访问的时候才加载对应组件,这样就更加高效了。

    结合webpack的代码分割功能即可实现一个简单的懒加载

    const index = resolve => {
        import('@/components/index/Index').then(module => {
            resolve(module)
        })
    }
    
    //引入方式
    const router = new Router ({
         route:[{
                path: '/',
                name: 'Index',
                component: Index
        }]
    })

    还有一种推荐的方式

    // r就是resolve,最好是将他们写成一行以减少空间的占用
    const list = r => require.ensure([], () => r(require('../components/list/list')), 'list');
    // 路由也是正常的写法 这种是官方推荐的写的 按模块划分懒加载 const router = new Router({ routes: [ { path: '/list/book', component: list, name: 'book' } ] })
  • 相关阅读:
    面向对象程序设计作业1
    寒假作业4
    寒假作业3
    寒假作业2
    寒假学习计划
    三个生命中极可爱的人与难舍的往事
    Numpy and Pandas
    入门级神经网络之权重训练
    tensorboard入门
    1
  • 原文地址:https://www.cnblogs.com/minjh/p/9504230.html
Copyright © 2011-2022 走看看