SASS Module System Migration

[hupf]

Ausgangslage

• Mit dem Update auf Angular 19 gibt es beim Build folgende Warnung: Sass @import rules are deprecated and will be removed in Dart Sass 3.0.0. More info and automated migrator: https://sass-lang.com/d/import
• Details zum Breaking Change: https://sass-lang.com/documentation/breaking-changes/import/
• Details zum neuen SASS Module System: https://css-tricks.com/introducing-sass-modules/
• Die aktuellste Bootstrap Version v5 unterstützt z.Z. das SASS Module System noch nicht. Gemäss einer Aussage eines Entwicklers soll mit Bootstrap v6 dies supported werden. Wann dieser Release kommt ist unbekannt.

Lösung

Es gibt folgende Varianten:

• Wir warten auf Bootstrap v6 und hoffen, dass dies vor dem Update auf Dart Sass 3.0.0 herauskommt, migrieren dann auf das neue SASS Module System mit @use und @forward. Es besteht die Gefahr, dass Bootstrap uns beim Update auf die nächste Angular Version blockieren wird.
• Wir migrieren auf Bootstrap mit CSS Properties (kein SASS mehr). Dies wäre grundsätzlich wünschenswert, würde aber bedeuten, dass wir nicht nur das Bootstrap Customizing und die Verwendung der Bootstrap Variablen migrieren müssten, sondern auch unsere eigenen SASS Styles. Der Aufwand dafür müsste geschätzt werden.