深入理解webpack打包机制
发布时间:2020-12-24 13:12:50 所属栏目:资源 来源:网络整理
导读:一、单入口文件如何打包 /src/single/index.js index2 = require( util = require( console.log(index2); console.log(util); /src/single/index2.js util = require( = ; /src/single/util.js module.exports = ; /config/webpack.config.single.js webpack
我们在开发一些较复杂的应用时,如果没有对代码进行切割,将第三方库(jQuery)或框架(React) 和业务代码全部打包在一起,就会导致用户访问页面速度很慢,不能有效利用缓存。 utilA = require( utilB = require(<span style="color: #008000">//<span style="color: #008000"> /src/multiple/pageB.js<span style="color: #0000ff">const utilB = require(<span style="color: #800000">'<span style="color: #800000">./js/utilB<span style="color: #800000">'<span style="color: #000000">); console.log(utilB); <span style="color: #008000">//<span style="color: #008000"> 异步加载文件,类似于 import() <span style="color: #0000ff">const utilC = () => require.ensure([<span style="color: #800000">'<span style="color: #800000">./js/utilC<span style="color: #800000">'<span style="color: #000000">],function(require) { console.log(require(<span style="color: #800000">'<span style="color: #800000">./js/utilC<span style="color: #800000">'<span style="color: #000000">)) }); utilC(); (编辑:上饶站长网) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |