塊供應商文件在生產中太大

Question

在生產構建我的 vue.js 應用程序后，我發現我的塊供應商文件太大，這對 web 性能有影響，屏幕如下：

如何減小此文件的大小？

我嘗試通過延遲加載在我的 router.js 中導入組件但在這里沒有幫助，這個問題的另一種解決方案是什么？

謝謝你的幫助！

Answer 1

除了前面的評論，您可能需要分析導入到您的應用程序中的內容。

執行此操作的一個好方法是通過依賴性分析。 如果您使用的是 vue-cli，則可以將Webpack Bundle Analysis添加到您的 devDependencies。 這將允許您查看正在導入的內容。

特別注意圖標庫（如@mdi）和其他輔助庫（如@vueuse 或 lodash）。 如果它們導入不正確，您最終可能會得到整個 package，而不是僅使用 treeshaking。