Font inlining cache is not created or reused
維護者通常 1 天內回覆
評估
- 難度
- 2/5
- 預估耗時
- 1-3 小時
- 新手友好度
- 82/100
- Issue 類型
- 缺陷
- 描述清晰度
- 描述清楚
- 活躍度
- 活躍
- 技術堆疊
- typescript
- 領域
- build-system
研究方向
從 packages/angular/build/src/utils/index-file/inline-fonts.ts 開始。比較快取讀取雜湊（Base64 編碼的 SHA-256，約第 184 行）與快取寫入雜湊（十六進位，約第 258 行），並檢查寫入路徑在呼叫 writeFile 之前是否會建立父目錄。完成的標準是：快取目錄會自動建立，並且在網路被阻斷的情況下，第二次建置會重用已儲存的樣式表，而不發出新的請求。issue 中的重現步驟可用於驗證這一點。
由索引模型根據 Issue 內容生成。
描述
Hi! I found two issues with the font stylesheet disk cache: the cache directory isn't created automatically, and even when it exists, valid cached CSS is deleted instead of reused.
Command
build
Is this a regression?
I haven't verified the last working version.
Description
When font inlining is enabled, the CLI can cache stylesheets fetched from Google Fonts. However, the cache currently does not prevent repeated downloads. A build can fail when the font request is unavailable, even after the same stylesheet was successfully cached by the previous build.
Minimal Reproduction
Minimal reproduction and run instructions
The application uses Angular CLI and @angular/build 22.2.6, with persistent caching and font inlining enabled. Its global stylesheet imports:
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap");
Run locally to test the disk cache across separate CLI builds. The following commands are for macOS/Linux.
1. Build with an internet connection.
git clone --single-branch --branch repro-font-inline-cache https://github.com/nagahara-naoki/angular-cli.git font-cache-repro
cd font-cache-repro
npm ci
npm run build
ls .angular/cache/22.2.6/repro/angular-build-fonts
The build succeeds, but the font cache directory does not exist.
2. Create the missing directory and build again while online.
mkdir -p .angular/cache/22.2.6/repro/angular-build-fonts
npm run build
ls .angular/cache/22.2.6/repro/angular-build-fonts
The build succeeds and creates one cache file.
3. Build again with an unreachable HTTPS proxy.
HTTPS_PROXY=http://127.0.0.1:9 npm run build
ls .angular/cache/22.2.6/repro/angular-build-fonts
The proxy setting applies only to that command, allowing the font request to fail without changing system network settings.
The build fails, and the previously saved cache file has been deleted. The directory is now empty.
Expected Behavior
The CLI creates the cache directory automatically. Once the font stylesheet is cached, subsequent builds reuse it without requesting the same URL again.
Actual Behavior
The directory is not created automatically. After creating it manually, the next build discards valid cached content and attempts another download. If that request fails, the build fails too.
Exception or Error
Failed to inline external stylesheet 'https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap'.
Error: Inlining of fonts failed. An error has occurred while retrieving https://fonts.googleapis.com/css2?family=Roboto:wght@400&display=swap over the internet.
connect ECONNREFUSED 127.0.0.1:9
Your Environment
Angular CLI: 22.2.6
Angular: 22.2.6
@angular/build: 22.2.6
Node.js: 24.22.2
npm: 11.19.1
TypeScript: 6.0.3
OS: macOS 26.5.2, arm64
Anything else relevant?
The same causes are present in InlineFontsProcessor at repository commit 8b26efa1ba2b922d459f88add85e7e9a9a1dd9de:
- Cache reads compute a Base64 SHA-256 hash, while cache writes store a hexadecimal hash. These cannot match, so valid cache files are treated as corrupted and removed.
- The write path calls
writeFilewithout creating the parent directory. The resulting error is caught, so the build succeeds without saving the stylesheet.
- 主要語言
- TypeScript
- 星號
- 27k
- 分支
- 11.8k
- 平均合併
- 1 天 3 小時
- 30 天內合併 PR
- 271
環境準備
- 沒有 Dockerfile 或 Docker Compose 檔案
- 有 Pull Request 範本
- 閱讀貢獻指南
從這裡開始
- 先讀完整個 Issue，再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫，在一個分支上完成修改。
- 送出 Pull Request，並在描述裡引用這個 Issue 編號。
angular/angular-cli 的其他 Issue
-
area: @angular/cli
難度 3/5 半天 新手友好度 42/100
angular/angular-cli#34716 ·
維護者通常 1 天內回覆
-
難度 3/5 1-2 天 新手友好度 72/100
angular/angular-cli#34688 ·
維護者通常 1 天內回覆
-
`ng generate application` produces a missing stylesheet when a workspace component type is configured可能已有人在做 @nagahara-naoki 於 2 天前認領。 未關閉area: @schematics/angular
難度 2/5 1-3 小時 新手友好度 25/100
angular/angular-cli#34684 ·
維護者通常 1 天內回覆
-
area: @angular/build
難度 4/5 3-5 天 新手友好度 55/100
angular/angular-cli#34674 · 2 則留言 ·
維護者通常 1 天內回覆
-
Tailwind CSS v4 classes in new or moved files are not picked up by ng serve until another rebuild可能重新可做 關聯的 PR 已關閉且未合併。 未關閉area: @angular/build
難度 4/5 3-5 天 新手友好度 35/100
angular/angular-cli#34446 ·
維護者通常 1 天內回覆
查看 angular/angular-cli 的全部 Issue
相似的 Issue
-
難度 2/5 1-3 小時 新手友好度 62/100
OHDSI/Data2Evidence#3693 ·
維護者通常 3 天內回覆
-
severity:low triage:confirmed
難度 2/5 1-3 小時 新手友好度 84/100
維護者通常 1 天內回覆
-
bug package:workers-shared
難度 2/5 1-3 小時 新手友好度 72/100
cloudflare/workers-sdk#16924 · 1 則留言 ·
維護者通常 1 天內回覆
-
bug frontend priority: low
難度 2/5 1-3 小時 新手友好度 82/100
nooriegarg/ContribIQ#74 ·
維護者通常 1 天內回覆
-
parse: child keys like `007`, `1e3`, `0x1f`, `-1` make the parent an empty array and hide the value未關閉
難度 2/5 1-3 小時 新手友好度 78/100