Wie man die Angular-Warnung behebt: @import tailwindcss: Sass @import rules are deprecated and will be removed

Problem

In deinem Angular-Projekt, das SASS und Tailwind CSS verwendet, tritt die folgende Build-Warnung auf:

sass_deprecation_warning.txt
▲ [WARNING] Deprecation [plugin angular-sass]

    src/styles.sass:2:8:
      2 │ @import "tailwindcss";
        ╵         ^


  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

  The plugin "angular-sass" was triggered by this import

    angular:styles/global:styles:1:8:
      1 │ @import 'src/styles.sass';
        ╵         ~~~~~~~~~~~~~~~~~

Lösung

Zuerst ist es wichtig zu wissen, dass du diese Warnung typischerweise einfach ignorieren kannst.

Nichtsdestotrotz, hier ist, wie du sie beheben kannst. Finde die folgende Zeile in deiner styles.sass oder wo immer du Tailwind CSS importiert hast:

styles.sass
@import "tailwindcss";

Und ersetze sie durch:

styles.sass
@use "tailwindcss";

Du musst die @use-Regel vor allen anderen Stilen oder Importen am Anfang der Datei platzieren.


Ähnliche Beiträge nach Kategorie: Angular, CSS, Tailwind