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