SomMeri / less4j

Less language is an extension of css and less4j compiles it into regular css. Less adds several dynamic features into css: variables, expressions, nested rules, and so on. Less was designed to be compatible with css and any correct css file is also correct less file.
145 stars 47 forks source link

& selector creates new scope within same selector path #341

Open twhoff opened 8 years ago

twhoff commented 8 years ago

Using the ampersand to create an anonymous scope within a selector in LESS4J creates duplicate selectors in the CSS output, where in Node LESS, the output is still grouped under a single selector. Duplication causes larger compiled files and seems to take more time to compile as well... could be an issue with how LESS4J handles scope?

Simple example:

.test {
    .test-mixin();
    & {
        @value: 2;
        value: @value;
    }
    value: @value;
}

.test-mixin() {
    @value: 1;
}

Compilation result:

// Node LESS - correct

.test {
  value: 2;
  value: 1;
}
// LESS4J - duplication

.test {
  value: 1;
}
.test {
  value: 2;
}