Debugging Less in browsers

A key part of developing code of any description is the fixing of any errors or bugs; working with Less code is no exception. We can, of course, do this manually or use a linting tool such as CSS Lint (, but either is likely to require working directly with the compiled CSS code, which will make it harder to trace a fault back to your existing Less code.

Fortunately, we have a couple of options that will help in this respect—we can either debug directly in Firefox using the FireLESS plugin, or we can set up a source map that will translate a compiled style back to the line number in the original Less file. Let's take a look at installing FireLESS first and get ready for when we start developing ...

Get Learning Less.js now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.