TechOverflow Logo
TechOverflow

Angular：如何修复 @import tailwindcss: Sass @import rules are deprecated 警告

English Deutsch 简体中文

问题

在使用 SASS 和 Tailwind CSS 的 Angular 项目中，你遇到以下构建警告：

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';
        ╵         ~~~~~~~~~~~~~~~~~

解决方案

首先需要知道，你通常可以直接忽略此警告。

不过，以下是修复方法。在 styles.sass 或你导入 Tailwind CSS 的位置找到以下行：

styles.sass
@import "tailwindcss";

替换为：

styles.sass
@use "tailwindcss";

必须将 @use 规则放在文件顶部，即所有其他样式或导入之前。

Check out similar posts by category: Angular, CSS, Tailwind