webpack_報錯:'WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB). This can impact web performance.'

目錄

• 報錯詳情
• 錯誤原因
• 解決方法
• 參考博客

報錯詳情

WARNING in asset size limit: The following asset(s) exceed the recommended size limit (244 KiB).
This can impact web performance.
Assets:
images/4d6bc2ae9cb14bbb4bd9de93ba4437a7.png (3.67 MiB)

WARNING in webpack performance recommendations:
You can limit the size of your bundles by using import() or require.ensure to lazy
load some parts of your application.
For more info visit https://webpack.js.org/guides/code-splitting/

錯誤原因

webpack在打包時,如果資源壓縮超過250kb時,會報錯提示:
You can limit the size of your bundles by using import() or require.ensure to lazy load some parts of your application

解決方法

在webpack.config.js文件中添加如下代碼：
加大文件允許體積，提升報錯門欄。

const config = {

    // some code

    performance: {
        hints: "warning", // 枚舉
        maxAssetSize: 300000, // 整數類型（以字節為單位）
        maxEntrypointSize: 500000, // 整數類型（以字節為單位）
        assetFilter: function (assetFilename) {
            // 提供資源文件名的斷言函數
            // 只給出js與css文件的性能提示
            return assetFilename.endsWith('.css') || assetFilename.endsWith('.js');
        }
    }
};

參考博客

js壓縮合並資源，webpack報WARNING in asset size limit
webpack打包報錯
webpack中文文檔