.LESS files appear in twitter boostrap

Question

I have included bootstratp.css simply by:

<link href='bootstrap.css' rel='stylesheet'>

But when I load the page, and inspect it in Firefox, I see a number of .LESS files appear as well. What is the problem? I have no .LESS files in my project at all.

Answer 1

Bootstrap is built on top of LESS (and ported to SASS too)

On the page: http://getbootstrap.com/getting-started/

When downloading the source code, you can choose to download the minified framework, or download the original source code (with compiled CSS + original LESS file) which is most likely the case.

The compiled .css file will still have reference to the .less file (intentionally) so you can track where they are originally in the .less files (which are organised in different files according to their component names).

On modern browsers like Firefox and Chrome, these references are picked up automatically and shown when you inspect the page to ease your debugging.

Generally this shouldn't pose any issue, however it is encouraged to remove source files on production, which you can easily do so by removing the last commented line in your .css file, or simply switch to minified and compressed bootstrap .css file.