Question

就是这样，它抱怨说：

SyntaxError：错误评估函数darken：a.toHSL不是第24行第1列的函数：

这似乎应该有效;我究竟做错了什么？我怎样才能得到我想要的效果？

@red2: #842211;
@green2: #842212;
@blue2: #842213;

@colors: red2, blue2, green2;

.color-style-helpers(@colors; @index) when (@index > 0) {
  .color-style-helpers(@colors; (@index - 1));

  @colorName : extract(@colors, @index);
  @color : ~"@{@{colorName}}";
  // @color : #ffffff; // Uncomment this line and this will work
  @darkColor : darken(@color, 10%);      

  .background-@{colorName} {    
    border-color: @darkColor;
    background-color: @color;
  }     
}


.color-style-helpers(@colors; length(@colors););

您可以看到结果here

Answer 1

问题在于您的示例中的以下代码行。它使@color var的内容被视为字符串而不是颜色。因此，Less编译器无法将颜色转换为darken函数所需的HSL值，从而导致错误。

@color : ~"@{@{colorName}}";

而不是那样，只需使用双@语法。您的案例不需要包装引号或转义功能。

@color : @@colorName;

为什么不编译？我该怎么办才能修复它？

1 个答案: