我尝试通过 lessphp 将此 .less 代码编译为 .css 并收到此错误:
Fatal Error:
====================
infinite loop detected: @pos-x: failed at `background-position: @pos-x 0; }` line: 3
这是我的代码。
@pos-x : 0;
@w : 30px;
.a { background-position: @pos-x 0; }
@pos-x: @pos-x - @w;
.b { background-position: @pos-x 0; }
这是怎么回事?我可以在 LESS 中使用变量覆盖吗?
最佳答案
不允许
@pos-x: @pos-x - @w;
。 The documentation states ,“请注意,LESS 中的变量实际上是‘常量’,因为它们只能定义一次。”
我相信在这种情况下 LESS 会发生的事情本质上是这样的:
@pos-x: 0;
@pos-x: @pos-x - 30px; puts it into this loop...
@pos-x = -30px - 30px ...
@pox-x = -60px - 30px ...
@pox-x = -90px - 30px ... etc.
因此,它不断地重新计算@pos-x
,试图得出从未达到的最终分辨率。每次重新分配时,它都会尝试根据新分配进行重新评估。
所以做这样的事情:
@pos1-x : 0;
@w : 30px;
.a { background-position: @pos1-x 0; }
@pos2-x: @pos1-x - @w;
.b { background-position: @pos2-x 0; }
关于css - "Fatal Error: infinite loop detected"通过 lessphp,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/13918531/