: Is there a way to compile LESS files to CSS (so that every browser doesn't have to)? I'm considering using LESS but I cringe at the thought of a browser having JavaScript disabled and my

@Marchetta884

There are a number of options for compiling LESS to CSS on the server, and the one you choose will probably depend on what you use for the rest of the site.


If you use node.js, the original lesscss will do the job.
If you use PHP, lessphp. It has a slightly rubbish API when it comes to passing variables in from PHP, but it does the job.
If you use Ruby, SASS isn't LESS, but is so similar that when I switched from using SASS (personal project) to LESS (a PHP project at work) I didn't notice any differences other than the file extension. It also has a useful library of mixins - COMPASS. I haven't tried using them with LESS, but I expect they'd work. (Apparently LESS was originally Ruby, so there's probably an old compiler floating around somewhere too).
If you use ASP.Net, there's .less. I haven't used this one, so I don't know how well it works.
If you use Java, lesscss4j wraps up compiling with the original LESS and Java 6's built-in Rhino scripting environment.
If you use Perl, there's a LESSp module in CPAN.

Vote Up Vote Down

@Bryan171

I use SimpLESS - drag, drop, done.

Vote Up Vote Down

@Sims2060225

LESS comes with a binary (lessc) that lets you precompile your .less files. You use it as such:

$ lessc styles.less > styles.css


But I think most people just use the lessc -w or lessc --watch command to recompile the CSS stylesheet automatically whenever the LESS file is updated. You can also have lessc minify the CSS, e.g. lessc -w -x.

Edit: Just to clarify, lessc comes with the server-side install (i.e. when you install less via the node.js package manager). But you can download it manually from GitHub.

lessc is located at /bin/lessc. This is of course a *nix binary (should also work for Mac), but there is a Windows binary (lessc.exe) based on dotless, which is another Windows LESS compiler.

Update:
Use less-watch to automatically compile.

Alternatively, many developers these days use task runners like grunt to handle build automation (compiling, minify, testing, etc.). Using grunt-contrib-watch, grunt-contrib-less and grunt-contrib-livereload, you can really streamline your development workflow.

E.g. if you use yo to scaffold your new web project, it comes preconfigured to watch your LESS/CSS/JS/HTML files for changes and recompile the necessary parts of your project when needed. Simply run grunt serve, and you're ready to code without having to worry about manually compiling (LESS/SASS/CoffeeScript)/minifying/concatenating your code or refreshing your browser manually like a caveman...

Vote Up Vote Down

@Heady270

Yes. You can use an app that auto-compiles LESS files to CSS on your development machine as you code. Then simply upload the generated CSS file to your server when you're done developing.


Crunch! for Windows & Mac
WinLess for Windows
CodeKit for Mac

Vote Up Vote Down