問題：
執行命令 ：npm build --pord，出現以下錯誤：
WARNING in Invalid background value at 11:14. Ignoring. WARNING in budgets, maximum exceeded for initial. Budget 2 MB was exceeded by 3.73 MB. ERROR in budgets, maximum exceeded for initial. Budget 5 MB was exceeded by 750 kB.
解決方案：
打開angular.json文件，找到budgets看到這段
"budgets": [ { "type": "initial", "maximumWarning": "2mb", "maximumError": "5mb" } ]
看得出來得修改maximumWarning值來防止出現此警告，和錯誤。
修改后：
"budgets": [ { "type": "initial", "maximumWarning": "6mb", "maximumError": "6mb" } ]
出現這個問題得原因是，編譯得時候運行內存超過預算了。
什么是Angular CLI預算？預算是Angular CLI鮮為人知的功能之一。這是一個很小但很整潔的功能！
隨着應用程序功能的增長，它們的大小也隨之增長。預算是Angular CLI中的一項功能，可讓您在配置中設置預算閾值，以確保您的應用程序的一部分保持在您設置的邊界內 — 官方文檔
換句話說，我們可以將Angular應用程序描述為一組稱為JavaScript的已編譯JavaScript文件，這些文件是由構建過程生成的。角度預算允許我們配置這些捆綁包的預期大小。更重要的是，如果捆綁包的大小過於失控，我們可以為要接收警告甚至無法構建的錯誤配置條件閾值！
如何定義預算？ Angular預算是在angular.json文件中定義的。為每個項目定義預算很有意義，因為工作區中的每個應用程序都有不同的需求。
務實地思考，只有為生產構建定義預算才有意義。產品構建在應用了諸如搖樹和代碼最小化之類的所有優化之后，將創建具有“真實大小”的捆綁包。
糟糕，構建錯誤！超過最大捆束尺寸。這是一個很好的信號，告訴我們出了點問題…
- 我們可能已經嘗試過我們的功能，但未正確清理
- 我們的工具可能會出錯並執行錯誤的自動導入，或者我們從建議的導入列表中選擇了不良項目
- 我們可能會在不適當的位置從惰性模塊導入內容
- 我們的新功能非常強大，不適合現有預算
第一種方法：將文件壓縮嗎？
一般來說，壓縮文件的大小僅為原始文件的20％，這可以大大減少應用程序的初始加載時間。要檢查是否已壓縮文件，只需打開開發者控制台的“網絡”標簽。在“響應標頭”中，如果您應該看到“ Content-Encoding：gzip”，則可以使用。
如何gzip的？ 如果您在大多數雲平台或CDN中托管Angular應用，則不必擔心此問題，因為它們可能已經為您解決了此問題。但是，如果您有自己的服務器（例如NodeJS + expressJS）為Angular應用程序提供服務，則一定要檢查文件是否已壓縮。以下是在NodeJS + expressJS應用中gzip靜態資產的示例。您幾乎無法想象，這種簡單的中間件“壓縮”功能會將捆綁包的大小從2.21MB減少到495.13KB。
const compression = require('compression')
const express = require('express')
const app = express()
app.use(compression())
第二種方法：：分析您的Angular捆綁包
如果捆綁包的大小確實太大，則可能要分析捆綁包，因為您可能使用了不合適的大型第三方包裝，或者如果您不再使用它，則忘記刪除某些包裝。Webpack具有驚人的功能，可讓我們直觀地了解Webpack捆綁包的組成。
了解更多相關：
https://blog.angularindepth.com/optimize-angular-bundle-size-in-4-steps-4a3b3737bf45?gi=d46cfade9db9
此隨筆乃本人學習工作記錄，如有疑問歡迎在下面評論，轉載請標明出處。
如果對您有幫助請動動鼠標右下方給我來個贊，您的支持是我最大的動力。