I'd like to use LESS stylesheets in a parent and child theme, in which most of the stylesheet information is specified by the parent and the child simply overrides a few files. This is possible with the Ruby version of LESS like so:
var parser = new(less.Parser)({
paths: ['.', './lib'], // Specify search paths for @import directives
filename: 'style.less' // Specify a filename, for better error messages
});
but is it possible with the command line compiler lessc
? I'd like to say:
$ lessc --path=".;../parent" style.less
Using Less. js in the browser is the easiest way to get started and convenient for developing with Less, but in production, when performance and reliability is important, we recommend pre-compiling using Node.
less -v is used to get the current version.
Overview. Less (which stands for Leaner Style Sheets) is a backwards-compatible language extension for CSS. This is the official documentation for Less, the language and Less.js, the JavaScript tool that converts your Less styles to CSS styles.
Pre-compiling LESS into CSS: To compile LESS into CSS, we use the below command in a command prompt. The lessc command lets us precompile our LESS file into a basic CSS file. This helps us in writing modular code using LESS programming and still getting all the benefits of CSS by compiling it into traditional fast CSS.
Looking at the lessc source code:
case 'include-path':
options.paths = match[2].split(':')
.map(function(p) {
if (p && p[0] == '/') {
return path.join(path.dirname(input), p);
} else if (p) {
return path.join(process.cwd(), p);
}
});
break;
You can pass multiple paths to lessc. So the correct syntax for your example is:
lessc --include-path=".:../parent" style.less
Marcus
There's a --include-path switch that you can use.
lessc --include-path=./inc/ main.less
Note, it needs to be relative to the path that lessc is executing in.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With