Question

我有3个主要代码拆分块，main.x.js，0.x.js和1.x.js.

我正在使用require.ensure进行拆分，并且还尝试使用新的简单Promise语法进行拆分。代码拆分本身似乎工作得很好，3个块得到输出并使用HTML可视化器我可以看到它们只包含我想要的代码。

但是，当我打开应用程序的主页面时，webpack似乎是在主页面上使用“prefetch”立即加载我的所有代码拆分块。我可以在devtools中看到这个目的：在0.js和1.js块上预取。 main.js“正常”加载。

当我导航到需要0.x.js的网站的一部分时，我可以看到chrome触发“正常”请求以检索0.x.js.因此，分裂和运行时加载似乎（某种程度上）正常工作。

但是，我不希望这种预取行为，因为我首先使用代码拆分的原因是为了保存用户不会使用的部分网站带宽。有没有办法关闭这种预取行为？

这是使用webpack 2.7.0。

Answer 1

我发现解决方案之后，在Sean的评论之后意识到这不是webpack的错误。

＆＃34;问题＆＃34;是vue-server-renderer的createBundleRenderer函数，根据这里的文档https://ssr.vuejs.org/en/api.html#renderer-options，诀窍是shouldPreload和shouldPrefetch函数。

只需添加：

＆＃13;

 shouldPrefetch: (file, type) => {
   // 0.js, 1.js
   return false;
 },
 shouldPreload: (file, type) => {
   // main.js, manifest.js
   return true;
 },

＆＃13;

到createBundleRenderer选项为我解决了这个问题。

Webpack：使用预取

1 个答案: