In my previous post, I mentioned about using Bootstrap for my works. One advantage of using Bootstrap is that we can easily work with its .less files. But, instead of using less.js, I prefer using LESS compiler to generate the real static stylesheet file. For now, I'm using LESS.app on my MacBook. The CodeKit looks interesting, anyway.
It's easy. Basically, I just need to include my custom .less file, and @import it from bootstrap.less file, so my bootstrap.less file looks like this:
// Components: Misc @import "thumbnails.less"; @import "media.less"; @import "labels-badges.less"; //@import "progress-bars.less"; //@import "accordion.less"; //@import "carousel.less"; @import "hero-unit.less"; // My custom CSS @import "custom.less";
I commented some lines there because I don't need them. It will generate smaller stylesheet file. If you download Bootstrap, you should find many .less files under less directory. Some files are needed for certain components. Using LESS.app is so easy because:
- I can set the output path. My HTML file will call a specific stylesheet file. I have it replaced automatically with a new compiled file.
- After saving my
custom.less— I use Coda, anyway — LESS.app will compile it automatically. So, actually I don't need to look at the LESS.app. - LESS.app can minify the output.
Nice. What is your favorite compiler?