Bootstrap css file adding less files

Question

I'm creating a site based on AdminLTE (v 2.3.0), a open source control panel template that uses bootstrap (v 3.3.5).

When I load my page in Google Chrome (v 48.0.2564.97 m) and use the developer tool (F12) in sources I notice that my content folder has a subfolder called less.

It is like:

Content/
 ├──less/
 |   ├──...
 |   ├──table.less
 |   └──...

The "..." means other files.
But here's the deal: I don't have any those files in my server and this table.less is generating problem to me.

So I did a test. One by one I remove the js and css files that I had referenced.
I discovered that when I add the bootstrap.css file this folder with all files appears.

Now my questions are:

• Why this is happened?
• How can I avoid it?
• And if I can't how can I make my css file has priority above the less files?

PS: I asked the 3rd question because normally the last css file to be add has priority when some property is overloaded. But in my case my last file is site.css, this file has definitions for tables, but when I open the page the properties of table.less has priority above my file and this is causing me problems.

Answer 1

You probably have a file called bootstrap.min.css.map or bootstrap.css.map next to the bootstrap css file. It's function is to reference the original source files and line numbers in your browser's developer tool section for each directive coming from your css file. If it were not there, you would always see bootstrap.css line 1 next to each css directive, which would not be very informative, this way you see the actual source structure that generated the css. It's all virtual, the less files are not there.