Angular build fails to resolve CSS when package is externalized
還沒有人認領這個 Issue。
評估
- 難度
- 4/5
- 預估耗時
- 3-5 天
- 新手友好度
- 35/100
- Issue 類型
- 缺陷
- 描述清晰度
- 基本清楚
- 活躍度
- 停滯
- 技術堆疊
- angular, bootstrap, sass
- 領域
- build-system
研究方向
從連結的最小重現開始,特別查看 angular.json 和 src/styles.scss,並在 externalDependencies 中列出 bootstrap 後執行 ng build。追蹤 Angular Sass/全域樣式建置期間如何處理外部化相依性;當 JavaScript 仍維持為外部相依性,同時 bootstrap/scss/bootstrap 成功解析時,即表示完成。
由索引模型根據 Issue 內容生成。
描述
Which @angular/* package(s) are the source of the bug?
compiler
Is this a regression?
No
Description
Hi there 👋
In a micro-frontend architecture, our goal is to compile CSS utilities while relying on importmap to load all JavaScript. I'm not sure if I’ve missed a configuration step or if this is expected behavior.
However, in the Vite ecosystem, when using the option to externalize dependencies, all the CSS is correctly resolved, but the JavaScript is excluded from the import.
export default defineConfig((env) => {
return {
build: {
rollupOptions: {
external: ["bootstrap"],
},
},
});
However, in the Angular environment, this approach causes the build to fail because it can't locate the CSS.
"projects": {
"test-angular": {
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"externalDependencies": ["bootstrap"],
To isolate the issue, I created a minimal reproduction using Bootstrap.
Thank you very much for the awesome work 🚀
Please provide a link to a minimal reproduction of the bug
https://github.com/Tragio/angular-externalize-repro
Please provide the exception or error you saw
> ng build
Application bundle generation failed. [1.968 seconds]
✘ [ERROR] Can't find stylesheet to import.
╷
2 │ @use "bootstrap/scss/bootstrap";
│ ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
╵
src/styles.scss 2:1 root stylesheet [plugin angular-sass]
angular:styles/global:styles:1:8:
1 │ @import 'src/styles.scss';
╵ ~~~~~~~~~~~~~~~~~
Please provide the environment you discovered this bug in (run ng version)
Angular CLI: 19.2.14
Node: 22.14.0
Package Manager: npm 10.9.2
OS: darwin arm64
Angular: 19.2.14
... cli, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, router
Package Version
---------------------------------------------------------
@angular-devkit/architect 0.1902.14
@angular-devkit/build-angular 19.2.14
@angular-devkit/core 19.2.14
@angular-devkit/schematics 19.2.14
@schematics/angular 19.2.14
rxjs 7.8.2
typescript 5.7.3
zone.js 0.15.1
Anything else?
No response
- 主要語言
- TypeScript
- 星號
- 27k
- 分支
- 11.8k
- 平均合併
- 17 小時 21 分鐘
- 30 天內合併 PR
- 181
貢獻指南
從這裡開始
- 先讀完整個 Issue,再讀專案的貢獻指南。
- 在 Issue 下留言說明你要接手 —— 這能避免兩個人做同樣的事。
- Fork 儲存庫,在一個分支上完成修改。
- 送出 Pull Request,並在描述裡引用這個 Issue 編號。
angular/angular-cli 的其他 Issue
-
area: @angular/build gemini-triaged
難度 2/5 1-3 小時 新手友好度 74/100
angular/angular-cli#33955 ·
-
area: @angular/cli gemini-triaged
難度 2/5 1-3 小時 新手友好度 72/100
angular/angular-cli#33055 · 1 則留言 · 3 個 reaction ·
-
angular/build:library area: @angular/build gemini-triaged
angular/angular-cli#34131 · 已指派 1 人 ·
-
angular/build:library area: @angular/build gemini-triaged
angular/angular-cli#34130 · 已指派 1 人 ·
-
angular/build:library area: @angular/build gemini-triaged
angular/angular-cli#34128 · 已指派 1 人 ·
查看 angular/angular-cli 的全部 Issue
相似的 Issue
-
難度 2/5 1-3 小時 新手友好度 75/100
vercel-labs/just-bash#464 ·
-
looksLikeSlug() is ASCII-only, so non-Latin entity slugs (e.g. Korean) skip exact match and collapse 未關閉
難度 2/5 1-3 小時 新手友好度 75/100
-
難度 2/5 1-3 小時 新手友好度 65/100
-
難度 2/5 1-3 小時 新手友好度 65/100
-
難度 1/5 1 小時以內 新手友好度 90/100
TanStack/tanstack.com#1293 ·