带有@import(inline)原因的LESSCSS循环;SyntaxError:递归变量定义“;
我有一个数组:带有@import(inline)原因的LESSCSS循环;SyntaxError:递归变量定义“;,less,Less,我有一个数组: @styles: amelia, cerulean, cosmo, cyborg, darkly, flatly, fonts, journal, lumen, readable, simplex, slate, spacelab, superhero, united, yeti; 我有我的循环: .loopStyles (@index) when (@index > 0) { @name: extract(@styles, @index); .nb-@{name
@styles: amelia, cerulean, cosmo, cyborg, darkly, flatly, fonts, journal, lumen, readable, simplex, slate, spacelab, superhero, united, yeti;
我有我的循环:
.loopStyles (@index) when (@index > 0) {
@name: extract(@styles, @index);
.nb-@{name} {
@import (inline) 'bower_components/bootswatch/@{name}/bootstrap.css';
}
.loopStyles(@index - 1);
}
.loopStyles(length(@styles));
但是,这会引发一个错误:SyntaxError:@index
的递归变量定义
如果我删除了@import
,或者如果我将其更改为less
或inline
以外的内容,它就可以正常工作
我试图实现的是一种在这些额外样式前面加上类的方法,因此我更希望样式表是内联导入的,而不是引用的 更少的文档状态“…在查找变量时,将只考虑在根或当前作用域中声明的变量,并且只考虑当前文件和调用文件。这意味着此用法通常仅限于在编译过程中注入变量或在根文件开头定义变量时使用。”
我在尝试执行此操作时遇到了许多不相关的错误。这是在
@import
语句中使用变量插值的一种方法。错误消息当然不正确,只是一个bug。我担心目前在循环中无法做到这一点(您必须通过复制粘贴重复所有导入语句)。还请注意,(内联)
选项不会在导入的样式前加前缀,因此会导致不正确的CSS。(less)
选项应该可以做到这一点。它实际上在最近的less版本中得到了改进。例如,上面的代码很可能在v2.0及更高版本中工作(不过我还没有测试过).尽管认识到这类事情总是需要一些额外的关注和理解,这是很重要的,因为正是因为。