如何在scss文件中导入scss文件？

Question

我在scss中使用了很多变量。所以我创建包含所有scss变量的文件。现在，我需要将此文件导入另一个scss文件。

我的尝试：

1. 在根目录中创建文件scss-vars.scss
2. 写入tsconfig.json：

"@bla/blaa/a/scss-vars":["libs/ui/scss-vars.scss"],

1. 在所有scss文件中使用跟随导入：

@import "@bla/blaa/a/scss-vars.scss";

但是结果是我在控制台中收到以下错误消息：

  

找不到要导入的样式表。

我需要不使用绝对路径的导入scss文件。

Answer 1

CSS预处理器不会查看tsconfig.json路径。 Angular CLI回购中有一个与此主题有关的open issue。

Answer 2

您可以在angular.json文件中为文件夹创建别名。

只需搜索'styles.scss'，您就会找到要添加任何其他路径的位置。

        "styles": [
          "src/styles.scss",
          "src/my-folder/some-styles.scss", // now you can import some-styles globally
        ],

在某些random-file.scss

中

@import 'some-styles';