首页 > Web开发 > 详细

[webpack]import打包优化

时间:2019-07-26 23:14:20      阅读:249      评论:0      收藏:0      [点我收藏+]
1、import优化

a、tree-shaking 把没用到的代码删除掉,import 在生产环境下 会自动去除掉没用的代码

b、scope hosting 作用域提升,在webpack中会自动省略一些可以简化的代码

2、懒加载
let button = document.createElement(‘button‘);
button.innerHTML = ‘dellyoung111‘;
button.addEventListener(‘click‘,function () {
    // es6 草案中的语法 jsonp实现动态加载文件
    import(‘./source.js‘).then(
        data=>{
            console.log(data.default)
        }
    )
})

document.body.appendChild(button);
通过触发点击事件来import文件,实现懒加载
需要插件
@babel/plugin-syntax-dynamic-import

[webpack]import打包优化

原文:https://www.cnblogs.com/piaobodewu/p/11253072.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!