angular-cli: [REGRESSION][v12.2] Font is no longer loaded
🐞 Bug report
Command (mark with an x)
- build
- serve
Is this a regression?
Yes, the previous version in which this bug was not present was: 12.1
Description
I have attached a simple demo app which reproduces the issue. Basically following font import in foo-bar.css (included in angular.json styles section) is ignored in v12.2 but works as intended in v12.1:
@import 'https://fonts.googleapis.com/css2?family=Manrope:wght@500;800&display=swap';
🔬 Minimal Reproduction
- Install dependencies and run
ng servein the demo project provided
🌍 Your Environment
@angular/cli 12.2.3
@angular-devkit/architect 0.1202.3
@angular-devkit/core 12.2.3
@angular-devkit/schematics 12.2.3
@schematics/angular 12.2.3
🐛 Bug demo
About this issue
- Original URL
- State: closed
- Created 3 years ago
- Comments: 17
Closed via https://github.com/angular/angular-cli/pull/21681
Opened an issue https://github.com/webpack-contrib/css-loader/issues/1365, let’s see what’s their response.
So indeed the
Monoropefont is not being loaded. I managed to track down the issue to css-loader, previously it moved absolute@importsto the top of the file but now they are not which causes the@importto become invalid since @import need to appear at the top of the file. https://developer.mozilla.org/en-US/docs/Web/CSS/@import#description