less - Bootstrap & LESS : clean "reference" import

Question

我读了 @import (reference)并尝试在不添加 css 块的情况下导入 bootstrap 。

如果我的 LESS 文件只有一行，我认为导出的 css 文件将为空:

@import (reference) "bootstrap";

但是 export.css有几行:

d.thumbnail > img, ...
.carousel-inner > .item > a > img {
  display: block;
  max-width: 100%;
  height: auto;
}
.btn-group-lg > .btn {...}
.btn-group-sm > .btn {...}
.btn-group-xs > .btn {...}
.container:before, ...
.modal-footer:after {
  content: " ";
  display: table;
}
.container:after, ...
.modal-footer:after {
  clear: both;
}

所以为什么？他们来这里是有原因的吗？

我使用的是 Less 1.7.0 和 Bootstrap 3.1.1。

Answer 1

这是因为 :extend内部文件 Bootstrap。
你可以使用这个(v.3.x.x):

// Core variables and mixins
@import "bootstrap/variables.less";
@import (reference) "bootstrap/mixins.less";

// Reset and dependencies
// @import "bootstrap/normalize.less";
// @import (reference) "bootstrap/print.less";
// @import (reference) "bootstrap/glyphicons.less";

// Core CSS
@import (reference) "bootstrap/scaffolding.less";
// @import (reference) "bootstrap/type.less";
@import (reference) "bootstrap/code.less";
// @import (reference) "bootstrap/grid.less";
@import (reference) "bootstrap/tables.less";
// @import (reference) "bootstrap/forms.less";
@import (reference) "bootstrap/buttons.less";

// Components
@import (reference) "bootstrap/component-animations.less";
@import (reference) "bootstrap/dropdowns.less";
// @import (reference) "bootstrap/button-groups.less";
// @import (reference) "bootstrap/input-groups.less";
// @import (reference) "bootstrap/navs.less";
// @import (reference) "bootstrap/navbar.less";
@import (reference) "bootstrap/breadcrumbs.less";
@import (reference) "bootstrap/pagination.less";
// @import (reference) "bootstrap/pager.less";
@import (reference) "bootstrap/labels.less";
@import (reference) "bootstrap/badges.less";
@import (reference) "bootstrap/jumbotron.less";
// @import (reference) "bootstrap/thumbnails.less";
@import (reference) "bootstrap/alerts.less";
@import (reference) "bootstrap/progress-bars.less";
@import (reference) "bootstrap/media.less";
@import (reference) "bootstrap/list-group.less";
// @import (reference) "bootstrap/panels.less";
@import (reference) "bootstrap/responsive-embed.less";
@import (reference) "bootstrap/wells.less";
@import (reference) "bootstrap/close.less";

// Components w/ JavaScript
// @import (reference) "bootstrap/modals.less";
@import (reference) "bootstrap/tooltip.less";
@import (reference) "bootstrap/popovers.less";
// @import (reference) "bootstrap/carousel.less";

// Utility classes
@import (reference) "bootstrap/utilities.less";
@import (reference) "bootstrap/responsive-utilities.less";

但这太荒谬了:(