Skip to content
Crisfole edited this page Aug 13, 2012 · 4 revisions

Using .less

From the command line

The command line tool is dotless.Compiler.exe, and it looks something like this:

$ dotless.Compiler source [destination]

The source is the .LESS file you want to compile, and the destination is the (optional) CSS file you want to compile it to. If you don’t specify a destination, dotless.Compiler will base it on the source you specified. If the extension of the source file is “.less” you can optionally omit it:

$ dotless.Compiler style.less style.css
$ dotless.Compiler style

Are equivalent.

Watching

dotless.Compiler also comes with an option to watch your .less files for any change, and recompile it automatically:

$ dotless.Compiler style.less --watch

Now, whenever you save your file, or any file which it imports, dotless.Compiler will re-compile it. If there are errors, it will ask you to fix them before continuing.

Compiling style.less -> style.css [Done]
Hit Enter to stop watching
Watching style.less for changes
Watching import.less for changes
Found change in 'style.less'. Recompiling...
Compiling style.less -> style.css [Done]

Using our ASP handler

Add a reference to dotless.Core.dll

Then add the following to your web.config

<add type="dotless.Core.LessCssHttpHandler,dotless.Core" validate="false" path="*.LESS" verb="*" />

This tells ASP to use our handler for all files ending in .less.
Next, to configure the handler add the following in the configSections section of your web.config
<section name="dotless"	type="dotless.Core.configuration.DotlessConfigurationSectionHandler,dotless.Core" />

and now you can configure less parameters in the following section
<dotless minifyCss="false"
	cache="true" />

From code

Add a reference to dotless.Core.dll

Less.Parse("div { width: 1 + 1 }");

which will output

div {
  width: 2;
}

Other ways

This blog post is quite comprehensive