css - SASS:使用@extend 时为 'Undefined variable'

Question

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

_base.scss

%base {
    color: $baseColor;
}

现在我想将它用于两个样式表:

main-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;
}