深入理解webpack打包机制(6)
发布时间：2020-12-24 09:09 所属栏目：34 来源：网络整理
导读：
导读：首先使用 installedChunks 来保存每个 chunkId 是否被加载过，如果被加载过，则说明该 chunk 中所包含的模块已经被放到了 modules 中，注意是 modules 而不是 installedModules。我们先来简单看一下 vendor chunk
|
首先使用 installedChunks 来保存每个 chunkId 是否被加载过，如果被加载过，则说明该 chunk 中所包含的模块已经被放到了 modules 中，注意是 modules 而不是 installedModules。我们先来简单看一下 vendor chunk 打包出来的内容。 webpackJsonp([module.exports = <span style="color: #800000">'<span style="color: #800000">util B<span style="color: #800000">'<span style="color: #000000">;}) 在执行完 manifest 后就会先执行 vendor 文件，结合上面 webpackJsonp 的定义，我们可以知道 [3] 代表 chunkId，当加载到 vendor 文件后，installedChunks[3] 将会被置为 0，这表明 chunk3 已经被加载过了。 webpack如何加载异步脚本： __webpack_require__.e = installedChunkData =(installedChunkData === </span><span style="color: #008000">//</span><span style="color: #008000"> a Promise means "currently loading".</span>
<span style="color: #0000ff">if</span><span style="color: #000000">(installedChunkData) {
</span><span style="color: #0000ff">return</span> installedChunkData[<span style="color: #800080">2</span><span style="color: #000000">];
}
</span><span style="color: #008000">//</span><span style="color: #008000"> setup Promise in chunk cache</span>
<span style="color: #0000ff">var</span> promise = <span style="color: #0000ff">new</span><span style="color: #000000"> Promise(function(resolve,<span style="color: #800080">120000</span><span style="color: #000000">);
script.onerror </span>= script.onload =<span style="color: #000000"> onScriptComplete;
function onScriptComplete() {
</span><span style="color: #008000">//</span><span style="color: #008000"> avoid mem leaks in IE.</span>
script.onerror = script.onload = <span style="color: #0000ff">null</span><span style="color: #000000">;
clearTimeout(timeout);
</span><span style="color: #0000ff">var</span> chunk =<span style="color: #000000"> installedChunks[chunkId];
</span><span style="color: #0000ff">if</span>(chunk !== <span style="color: #800080">0</span><span style="color: #000000">) {
</span><span style="color: #0000ff">if</span><span style="color: #000000">(chunk) {
chunk[</span><span style="color: #800080">1</span>](<span style="color: #0000ff">new</span> Error(<span style="color: #800000">'</span><span style="color: #800000">Loading chunk </span><span style="color: #800000">'</span> + chunkId + <span style="color: #800000">'</span><span style="color: #800000"> failed.</span><span style="color: #800000">'</span><span style="color: #000000">));
}
installedChunks[chunkId] </span>=<span style="color: #000000"> undefined;
}
};
head.appendChild(script);
</span><span style="color: #0000ff">return</span><span style="color: #000000"> promise;
};</span></pre>
（编辑：ASP站长网） |
相关内容
Indesign图片上的颜色
三分钟让你学会，如何
乌龙了！谷歌商店出现
Indesign应用技巧总结网友评论
推荐文章
热点阅读
