@Include(multiple)在LESS中具有相同var名称的不同值

时间:2015-02-12 14:41:59

标签: variables import scope include less

我会用LESS来做某事,但我不知道是否可能

我的问题如下:(例子不是我真正的代码,因此它只是一个非常简化的机制主义版本)

我为文件定义了一个通用定义: generic.less

.button {
    .@{subclassname} {
       color:@color;
       &:hover { color:@colorhover; }
    }
}

我有很多使用这种通用代码的文件。

将使用这些通用代码的两个示例文件: variation1.less:

@subclassname : variation1;
@color : red;
@colorhover : white;
@import (multiple) "generic";

variation2.less:

@subclassname : variation2;
@color : green;
@colorhover : blue;
@import (multiple) "generic";

全局LESS文件包含:

@import "variation1";
@import "variation2";

预期结果:

.button {
    .variation1 {
       color:red;
       &:hover { color:white; }
    }
}
.button {
    .variation2 {
       color:green;
       &:hover { color:blue; }
    }
}

获得的结果:

.button {
    .variation2 {
       color:green;
       &:hover { color:blue; }
    }
}
.button {
    .variation2 {
       color:green;
       &:hover { color:blue; }
    }
}

因为@var是由最后一个值定义的。 获得所需结果的最佳解决方案是什么? (我想保留相同的变量名称。)

提前谢谢

修改: | 解决方案成立:

variation1.less:

& { 
@subclassname : variation1; 
@color : red; 
@colorhover : white; 
@import (multiple) "generic"; 
} 

variation2.less:

& { 
@subclassname : variation2; 
@color : green; 
@colorhover : blue; 
@import (multiple) "generic";
}

0 个答案:

没有答案