LESS: Nested Import In Class

2019-09-13 21:57发布

问题:

I got a lot of less files that are imported into one main less file. That main file has some different variables containing hex-color.

e.g:

@black: #333;
@green: #007f4b;
...

@import "layout";
@import "html";
...

Is it possbile to do some thing with this base?

e.g:

@black: #333;
@green: #007f4b;

@import: "layout";
@import: "html";

.fanshop {
  @black: #111;
  @green: green;

  @import: "layout";
  @import: "html";
}

The result should look like:

.headline {
  background-color: #333;
}
.fanshop .headline {
  background-color: #111;
}

Is this possbile with any less compiler? Currently I'm using lessphp.

Thank you!

回答1:

It is possible in Less (not sure about exact version but most likely since 1.5.x), like this:

@black: #333;
@import "layout";

.fanshop {
    @black: #111;
    @import (multiple) "layout";
}

But that won't work in lessphp since it's somewhat behind Less 1.4.x. You could try less.php instead.