是否可以使用 Meteor 在 LESS 中从 Bootstrap class 继承？

Question

我正在使用 LESS 在我的 Meteor 应用程序中构建一些自定义 bootstrap button classes。（Bootstrap 通过 twbs:bootstrap Meteor 包添加到 Meteor，而不是在 LESS 中使用 @import。

例如，我有一个名为 .btn-pill 的 class，我想从 Bootstrap 的 .btn-xs 继承它，像这样：

HTML

<button class="btn btn-pill"></button>

少

.btn-pill {
    &:extend(.btn-xs);
    color: @text-color;
    background-color: @white;
    border: 1px solid @gray-main;
    &:hover {
        background-color: @gray-light;
    }
}

不幸的是，这似乎不起作用...当然，我总是可以在 <button> 标签中同时使用两个 classes:

<button class="btn btn-xs btn-pill"></button>

但我宁愿尽可能避免这种情况。

甚至可以在不同的文件中像这样使用 &:extend（就像我理解的 @extend 在 SASS 中一样 - 就像 in this SO question）？或者它不起作用，因为 Bootstrap 是通过 Meteor 包实现的？

Answer 1

从 Meteor v1.2 开始，更少的文件更易于管理。

下载官方 bootstrap less 发行版，将它们放在名为 imports 的文件夹中。这样做可以让您导入文件，而不是看到自动编译的文件。

将bootstrap.less文件放在imports文件夹外的上级文件夹中，并根据自己的结构修改导入文件夹路径。

现在您可以根据自己的喜好使用变量了。对他们做任何 less 通常允许你做的事。

或者，如果您坚持使用 Meteor 的早期版本，您可以使用 nemo64:bootstrap 自定义并使用来自 bootstrap.

的导入

是否可以使用 Meteor 在 LESS 中从 Bootstrap class 继承？

Is it possible to inherit from a Bootstrap class in LESS, using Meteor?

extend

less

twitter-bootstrap

meteor