SASS: 'Undefined variable' 当使用@extend

Question

我想为我的 android 和 ios 样式表使用一些通用样式。所以我将通用样式放在一个文件中。

_base.scss

%base {
    color: $baseColor;
}

现在我想将其用于两个样式表：

主要-ios.scss:

@import 'base';

$baseColor: #fff;
main {
    @extend %base;
}

主要-android.scss:

@import 'base';

$baseColor: #000;
main {
    @extend %base;
}

我希望编译为（android）：

main {
    color: #000;
}

但是，我得到的是

Syntax error: Undefined variable: "$baseColor".

无论如何我可以解决这个问题吗？

更新：

我明白了，首先在主文件里面定义变量而不是导入！

Answer 1

您是否尝试过在导入声明之前定义您的变量？

$baseColor: #000;

@import 'base';

main {
    @extend %base;
}

SASS: 'Undefined variable' when using @extend