Is there a way to compile LESS files to CSS (so that every browser doesn't have to)?

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

I use SimpLESS - drag, drop, done.

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