webpack---优化_懒加载、预加载

前言：这里的懒加载不是图片的加载，而是js文件的加载

一、懒加载

意义：延迟加载，触发一定条件才加载
触发方式：import方法放在异步回调函数中(这种方式当然会有代码分割)
btn.onclick = function () {
    import(/* webpackChunkName: 'test' */'./test').then(({ mul })=>{
        mul(3,4)
    })
}

二、预加载

意义：等其他资源加载完毕，浏览器空闲了，再偷偷加载
缺点：兼容性差，慎用
触发方式：在注释代码中加webpackPrefetch: true
btn.onclick = function () {
    import(/* webpackChunkName: 'test',webpackPrefetch: true */'./test').then(({ mul })=>{
        mul(3,4)
    })
}