Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I'm considering using LESS but I cringe at the thought of a browser having JavaScript disabled and my CSS not being readable (and the site looking awful).

Also, it offends the engineer in me to force every browser to "compile" that Less file to .css when we could just "compile" it once every-time we modify it.

share|improve this question
1  
@Anonymous- If you check out LESS, you should also have a look at SASS and COMPASS. –  Sorcy Jan 31 '12 at 18:13
    
Stylus and OOCSS are also similar products. –  Lèse majesté Jan 31 '12 at 23:14
1  
I have posted a related answer explaining how to set up LESS compilation automatically on the server: webmasters.stackexchange.com/questions/38386/… –  romaninsh Nov 28 '12 at 16:47
    
I didn't know anyone was compiling LESS in browsers! –  Kenny Evitt Nov 7 at 0:36

4 Answers 4

up vote 11 down vote accepted

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.

share|improve this answer

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...

share|improve this answer
1  
I'm not sure what version you're using. In the latest version 1.3.0 there is no --watch feature. A pull request for a --watch feature was shot down 9 months ago. github.com/cloudhead/less.js/pull/246 –  BullfrogBlues Sep 13 '12 at 23:24
    
@BullfrogBlues: Sorry, that was from the old Ruby-based lessc. –  Lèse majesté Sep 14 '12 at 21:52

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.
share|improve this answer
1  
There is a Ruby compiler that comes with the old LESS Ruby gem but it's not updated anymore so a lot of the new features won't work on it. Thus, if you use Ruby, I would recommend just using the lessc binary compiler that is based off of the latest version of less.js. –  Lèse majesté Jan 31 '12 at 22:56
    
@Lèsemajesté, I'd just go with SASS, but I didn't want to be accused of wilfully ignoring the possibility of compiling LESS in Ruby. –  Peter Taylor Jan 31 '12 at 23:03
1  
Yea, I think SASS would be the best option for Ruby since the LESS gem has been deprecated since the switch to JS. –  Lèse majesté Jan 31 '12 at 23:12

I use SimpLESS - drag, drop, done.

share|improve this answer

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.