lesscss-engine
lesscss-engine copied to clipboard
Can't specify search paths
Hi,
My usage of lesscss is the next one :
- I declare some less files, defining the css global body
- I declare many "variables less files" (containing only variables), for different look and field
- I generate a css file by filling my "css less file" with the desired "variables less file"
First of all : is there a best practice to do that ?
My problem is that I use the @import directive in the "css less file" to include my "variables less file" and so ... the imported file is always the same (ie the same path), so I need to change my "variables less file" (copy / paste overwrite) with the one I need each time.
I need to automate the generation.
Is there a way to specify the path (maybe in com.asual.lesscss.LessOptions ?) like it is possible with the client side version ? (http://lesscss.org/ paragraph "Configuration" : "Specify search paths for @import directives")
Thanks,
You can solve this by creating a custom ResouceLoader
implementation (see https://github.com/asual/lesscss-engine/pull/32) that would take the search path as parameter constructor parameter and then pass it to LessEngine
on initialization. Alternatively if you generate all outptut files in one batch and would like to avoid re-initializing LessEngine
each time, you could make your ResourceLoader
implemention mutable - provide a method for changing the search path and hold on to a reference to that object. Then set a desired search path before each generation step.
It occured to me that there's much simpler solution to your problem that will work out of the box with lesscss-engine 1.3.0. It seems to me that you simply got your includes backwards. Try this:
base.less
#header {
color: @color;
}
h2 {
color: @color;
}
blue.less
@color: blue;
@import "base.less";
green.less
@color: green;
@import "base.less";
Then generate green.css
and blue.css