less.js
less.js copied to clipboard
Whether the official statement "Selectors with variables will not match" is wrong?
To reproduce:
@variable: .bucket;
@{variable} { // interpolated selector
color: blue;
}
.some-class:extend(.bucket) {} // does nothing, no match is found
Current behavior:
.bucket,
.some-class {
color: blue;
}
Expected behavior:
.bucket {
color: blue;
}
Environment information:
lessversion: v4.2.0nodejsversion: 12.22.12operating system: win10
Added:
The following is the description of the official document:
extend-feature-selector-interpolation-with-extend
However, :extend attached to an interpolated selector works:
.bucket {
color: blue;
}
@{variable}:extend(.bucket) {}
@variable: .selector;
compiles to:
.bucket, .selector {
color: blue;
}
Done!
Using the same environment, the results are as follows: