css - 引用导入的 LESS 样式但不输出它们

Question

导入的LESS样式如何引用不输出？我确信 reference 应该可以解决问题，但它似乎没有按预期工作。

作为this Codepen显示，

.modal-content-custom {
  @import (less, reference) "https://netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.css";
  .modal-content;
}

编译为

.modal-content-custom {
  position: relative;
  background-color: #fff;
  -webkit-background-clip: padding-box;
  background-clip: padding-box;
  border: 1px solid #999;
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 6px;
  outline: 0;
  -webkit-box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.5);
}
.modal-content-custom html {
...

所以它只是忽略了reference。

Answer 1

已解决。 reference 导入选项被命名空间导入忽略。这将按预期工作。

@import (less, reference) "https://netdna.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.css";

.modal-content-custom {
  .modal-content;
}