(reference) imports broken

[Amparose]

Using Bootstrap 3 files, the (reference) import option doesn't handle media queries and "generative" structures.

Example 1

test.less

/* #BREAK-START */
@import (reference) "type.less";
/* #BREAK-END */

Produces:

test.css

/* #BREAK-START */
@media (min-width: 768px) {
  .dl-horizontal dd:before,
  .dl-horizontal dd:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
  }
  .dl-horizontal dd:after {
    clear: both;
  }
}
/* #BREAK-END */

So it works correctly until it hits the media query in the type.less file.

Example 2

The "make-grid" portions also transgress the (reference) import. Try:

/* #BREAK-START */
@import (reference) "grid.less";
/* #BREAK-END */

And basically the entire grid gets output (all the .make-* lines).

---

Example 1 is more interfering than example 2 as that means a modular approach, where media queries are bundled with the module/component will break the (reference) option for a project.

[Amparose]

Wondering if this has anything to do with #1469 (Reference import not importing media queries)

[MisterIsaak]

I'm experiencing the same issue. I don't suppose there's a work around?

[lukeapage]

I fixed a bug with media queries not coming through on mixin calls and I couldn't reproduce what you are describing with 1.6.3.

If this isn't fixed please give me a test case and what version of bootstrap you are using.

[Amparose]

Using LESS 1.6.3 & 1.7, if you pass a file with @import (reference) 'bootstrap.less' (referring to a Bootstrap 3.1.1 less folder) you get a similar issue - file is not empty.

I had a Grunt project that was running LESS 1.5.1 and Bootstrap 3.0.3 and it works as expected: output CSS file is empty. So a gremlin has creeped in somewhere...

[seven-phases-max]

file is not empty.

It looks like #1851 or #1878 (those leaking rules are results of &:extend(.clearfix all);)