Angular - 错误：初始超过了最大预算。 预算为5.00 MB，但只有5.19 MB中的197.06 kB没有达到。

Question

当我在构建我的Angular 12项目时，遇到了这个错误：

错误：初始值超过了最大预算。 预算为5.00 MB，但总共使用了5.19 MB，超出预算197.06 kB。

我的angular.json文件：

"budgets": [
    {
        "type": "initial",
        "maximumWarning": "4mb",
        "maximumError": "5mb"
    },
    {
        "type": "anyComponentStyle",
        "maximumWarning": "2kb",
        "maximumError": "4kb"
    }
],

然而我仍然遇到了错误。

我该如何解决这个问题？

谢谢。

- midowu

---

这个回答解决了你的问题吗？[预算警告，初始值超过最大值]（https://dev59.com/xVQJ5IYBdhLWcg3wYEu7） - Tran Son Hoang

Answer 1

您的预算是5MB，但您的捆绑大小超过了此限制（5.19MB），这导致出现此错误。您需要按以下方式在angular.json中增加maximumError预算：

            {
              "type": "initial",
              "maximumWarning": "4mb",
              "maximumError": "6mb"
            },

您还可以采用一些技术，尽可能地减少包的大小：

• 使用ng build --prod --build-optimizer。 对于更新版本，默认情况下使用ng build --prod或ng build
• 使用模块延迟加载并尽可能将您的应用程序模块化。
• 您还可以使用Ivy渲染引擎，它提供了更好的包大小
• 确保您的第三方依赖项可以被摇树优化。
• 使用第三方工具，例如webpack-bundle-analyzer，查看模块中导致膨胀的原因
• 还可以检查文件是否已进行了压缩

- deepakchethan

---

ng build --prod，这也已经过时了。ng build工作得很好。 - Raam Mishra

Answer 2

我认为你需要在CLI配置文件angular.json中定义大小界限。

{
  ...
  "configurations": {
    "production": {
      ...
      budgets: [
        {
          "type": "initial",
          "maximumWarning": "4mb",
          "maximumError": "5mb" // <==== change this number because your app is 5.19 MB now.
        }
      ]
    }
  }
}

参考文献：https://angular.cn/guide/build#configure-size-budgets

- Tran Son Hoang

---

太好了！根据错误提示，由于我的构建总共是5.26 MB，我将其改为6MB。 - Vince Banzon

Answer 3

您可以更改框架设置的限制。为此，您必须编辑位于项目根目录下的angular.json文件。

查找名为budgets的块。 maximumWarning值对应于超过该阈值时显示警告消息。 值maximumError对应于触发错误。

"budgets": [
       {
          "type": "initial",
          "maximumWarning": "2mb",
          "maximumError": "5mb"
       }
    ]

- mohamed riabi

---

欢迎来到SO！请先看一下之前给出的其他答案。你的方法已经在那里提到了。为了保持网站的清晰和方便查找答案，我们尽量避免重复回答。 - ahuemmer