less - 无法减少 grunt-contrib 以正确导入

Question

我有以下少

.signature-overlay {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000;
  position: absolute;
  **.opacity(.6);**
}

以及我的 grunt 文件中的以下内容...

less: {
  development: {
    options: {
  paths: ["default/less","default/less/bootstrap"]
    },
    files: {
      "css/less.css": ['less/*.less']
    }
  }
}

和在 default/less/bootstrap/mixins.less 中声明的不透明度

.opacity(@opacity) {
  opacity: @opacity;
  // IE8 filter
  @opacity-ie: (@opacity * 100);
  filter: ~"alpha(opacity=@{opacity-ie})";
}

但是当我运行 grunt 时，我得到...

Running "less:development" (less) task
>> NameError: .opacity is undefined in less/sigature.less on line 61, column 5:
>> 60     position: absolute;
>> 61     .opacity(.6);
>> 62   }
Warning: Error compiling less/signature.less Us
--force to continue.

Answer 1

问题是你需要像这样包含 mixins.less:

@import "bootstrap/mixins.less"; //I don't know you folder organizations

//..code...

.signature-overlay {
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background-color: #000;
  position: absolute;
  .opacity(.6);
}