css - SASS - 在多个文件中使用变量

Question

我想保留一个中央 .scss 文件，用于存储元素的所有 SASS 变量定义。

// _master.scss 

$accent: #6D87A7;           
$error: #811702;
$warning: #F9E055;
$valid: #038144;
// etc... 

该元素由于其性质，将有大量的 CSS 文件。在一个位置声明所有元素范围的样式变量很重要。

有没有办法在 SCSS 中做到这一点？

Answer 1

你可以这样做:

我有一个名为 utilities 的文件夹，里面有一个名为 _variables.scss 的文件

在该文件中，我这样声明变量:

$black: #000;
$white: #fff;

然后我有 style.scss 文件，我在其中导入所有其他 scss 文件，如下所示:

// Utilities
@import "utilities/variables";

// Base Rules
@import "base/normalize";
@import "base/global";

然后，在我导入的任何文件中，我应该能够访问我声明的变量。

只需确保在导入变量文件之前导入任何其他您想要使用它的文件。