Webpack错误,加载块失败

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了Webpack错误,加载块失败相关的知识,希望对你有一定的参考价值。

堆栈:Webpack 4.16.0,Node8,Vuejs2

在服务我的Vuejs应用程序时,我看到以下错误。

Error: Loading chunk 4 failed.
(missing: https://myapp.com/ui.chunk.bundle.js)
    at htmlScriptElement.s (demo:1)

此错误在各个版本中都是一致的,实际文件本身可以通过URL访问。

[我正在使用通过import()进行代码拆分,并且初始应用程序加载正常,但是当加载另一个块时,流程将中断,它在ui.chunk.bundle.jsvendors~ui.chunk.bundle.js之间也可以变化。

为生产进行构建时,显示了一个新错误,但似乎也与加载模块有关:

demo:1 TypeError: Cannot read property 'call' of undefined
    at o (demo:1)
    at Object.349 (ui.chunk.bundle.js:1)
    at o (demo:1)
    at o.t (demo:1)

我曾尝试升级webpack和babel,但由于之前工作得非常好,因此可能会陷入困境。

[在我的本地计算机而不是Google App Engine上运行该应用程序时,一切似乎都很好。

如何加载应用程序:它是通过脚本标签加载到其他网站的,因此domainA.com运行脚本标签,该脚本标签调用myapp.com/js,然后流程开始,即应用程序基于某种逻辑加载各种块。

在myapp.com上访问webpack生成的索引页面捆绑包时,所有内容均正确加载。

请帮助!

答案

这可能是跨站点脚本问题。确保myapp.com设置了正确的标题。

在myapp.com上,设置此标头:

Access-Control-Allow-Origin: https://domainA.com

您还应确保您的脚本标签的异步设置为false:

<script async="false" …

以上是关于Webpack错误,加载块失败的主要内容,如果未能解决你的问题,请参考以下文章

Webpack错误,加载块失败

Webpack 代码拆分:ChunkLoadError - 加载块 X 失败,但块存在

webassebly加载报错

React Router 代码拆分“随机”在加载块时失败

使用 webpack 代码拆分,如何加载块和 HTML 布局?

使用 webpack 加载 scss 失败