How to debug LESS in Chrome?

Question

It looks as though LESS debugging has come a decent distance since even a year ago, and I was wondering how many people have experience with debugging using developer tools in C

Answer 1

Blog post author here...I've gone back and updated my post so it now works with regular Chrome 26. Just checked in Canary and it doesn't seem to work anymore. So Chrome 24 - 26 are good but Canary is busted.

Answer 2

This is now working perfectly fine with less.js 1.5b4 and Chrome 30.0.1599.69

Basically, you need to make sure lessc generates valid source map url at the end of your css file:

/*# sourceMappingURL=/templates/lwks/css/template.css.map */

and that the .css.map file is being loaded by the browser. If this is still for some reason not working for you, in check chrome://flags Enable Developer Tools experiments is on

more details here: https://github.com/less/less.js/issues/1050

Answer 3

I think that the issues that you refer are not related.

As far as I understand you compile your LESS file on the server side and all you want to do is to retrieve the new css file and not the cached one? Am I right?

Did you tried disable cache on google chrome?