LESS Mixins不可用

Question

在我目前的项目中,我在icnludes的索引中有以下结构:

...

<link rel="stylesheet/less" type="text/css" href="css/master.less" media="screen" />

<!--module source CSS-->
<link rel="stylesheet/less" type="text/css" type="text/css" href="module/A/css/A.less" media="screen" />
<link rel="stylesheet/less" type="text/css" href="module/B/css/B.less" media="screen" />

...

在我的master.less我包括其他较少的文件,如mixin.less.在这个文件中我有很多声明工作正常 - 测试.

但是如果我尝试在我的模块中使用像.gradient这样的一些mixin,我会变成这样的错误:.gradient is undefined

放在mixin.less中的梯度mixin完全没问题:

.gradient (@startColor: white, @endColor: #eee) {
    background-color: @startColor;
    background: -webkit-gradient(linear, left top, left bottom, from(@startColor), to(@endColor));
    background: -webkit-linear-gradient(top, @startColor, @endColor);
    background: -moz-linear-gradient(top, @startColor, @endColor);
    background: -ms-linear-gradient(top, @startColor, @endColor);
    background: -o-linear-gradient(top, @startColor, @endColor);
}

当我直接在我的B.less中使用这个mixin时它起作用.所以我很困惑.我使用less.js的客户端部分,并在http://lesscss.org/上阅读了fkn手册,但我不知道什么是错的.

文件加载正确等等这里有什么问题？

Answer 1

你的每一个HTML文档中的LESS文件的获取编译独立,让你创造master.less任何混入停留withing只有这个文件的背景下,而不是其他.LESS文件可见.

我建议你这样做:

1. 使用所有mixins创建一个mixins.less文件,
2. 在你master.less,导入该文件mixins.less 第一,然后导入任何其他模块少的文件,
3. 在HTML文档中,仅引用master.less.

我同意您所遇到的情况在文档中没有明确定义,但我假设大多数想要使用less.js玩LESS的人只从一个文件开始.

希望这可以帮助.