Less syntax with @@ meaning

问题:

I have downloaded a theme for bootstrap and In their less sources I have a mixin like:

.label-color(@color) {
  @label-class:~"label-@{color}";
  @badge-class:~"badge-@{color}";
  @label-color:@@label-class;

 .@{label-class}, .@{badge-class} {
    background-color:@label-color !important;
 }  
}

.label-arrow(@color) {
   @label-class:~"label-@{color}";
   @label-color:@@label-class;

  .@{label-class}{
    &.arrowed:before {
        border-right-color:@label-color;
    }
    &.arrowed-in:before {
        border-color:@label-color;
    }
    &.arrowed-right:after {
        border-left-color:@label-color;
    }
    &.arrowed-in-right:after {
        border-color:@label-color;
    }
  }
}
.label-color(~"lime");
.label-color(~"red");

My problem is that @label-color:@@label-class; because my internal compiler less4j give me error at this double @@ and I don't understand why. Local compiler Crunch is working and know to compile that so is not a wrong syntax. Can someone give me a hint pls, ty.

回答1:

As already mentioned by @deceze, you can read at http://lesscss.org/features/#variables-feature-variable-names that the double @ will be use to create a variable variable name in Less:

For instance:

@red: darkred;
@color: "red";
p {
color: @@color; 
}

Outputs:

p {
  color: darkred;
}

Notice that the variable name (@color) should be a string.

The above should also work in less4j according the docs which can be found at: https://github.com/SomMeri/less4j/wiki/Less-Language-Variables:

If the variable contains a string, then it can act as a reference to another variable.