生产中的块供应商文件太大

Question

在生产构建我的 vue.js 应用程序后，我发现我的 chunk-vendors 文件太大，这对 Web 性能有影响，屏幕如下：

如何减小该文件的大小？

我尝试通过延迟加载在 router.js 中导入组件，但这里没有帮助，这个问题的另一个解决方案是什么？

谢谢你的帮助！

Answer 1

除了前面的评论之外，您可能需要分析导入到应用程序中的内容。

做到这一点的一个好方法是通过依赖性分析。如果您使用的是 vue-cli，则可以将Webpack Bundle Analysis添加到您的 devDependency 中。这将使您能够看到正在导入的内容。

请特别注意图标库（如 @mdi）和其他辅助库（如 @vueuse 或 lodash）等内容。如果导入不正确，您最终可能会得到整个包，而不是仅对使用的包进行 Treeshaking。