1

我曾尝试与lesshat 合作。我已将lesshat.less mixins 库上传到我的项目根文件夹。并创建了 1 个 .less 文件 - lesshat-tests.less 只有一个选择器和 mixin 调用。

@import "lesshat";
div {
    .background-image(linear-gradient(to bottom, #fb83fa 0%,#e93cec 100%));
}

我尝试使用 Webstorm 少 css 编译器插件编译该文件，并使用 node.js 模块少命令 lessc。Lessc 生成空文件，webstorm 插件生成错误，告诉插件无法评估 JS 函数。

我看到这个 mixin 使用了一些函数。但我无法获得任何关于在 less 中使用 JS 的信息。请帮帮我。

4

1 回答 1

0

Lesshat 的大多数 mixin 都是用 Javascript 编写的。less 编译器本身也是用 JavaScript 编写的，并且在您的 Less 代码中评估本地 JavaScript 调用，放置在反引号之间。

可能您的 Webstorm less css 编译器插件无法评估 Javascript 调用。lessc 编译器应该可以工作。

当我从https://raw.githubusercontent.com/madebysource/lesshat/master/build/lesshat.less下载 Lesshat mixins并通过运行编译您的代码时，lessc yourcode.less我在控制台中得到以下输出：

div {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmYjgzZmEiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U5M2NlYyIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #fb83fa 0%, #e93cec 100%);
  background-image: -moz-linear-gradient(top, #fb83fa 0%, #e93cec 100%);
  background-image: -o-linear-gradient(top, #fb83fa 0%, #e93cec 100%);
  background-image: linear-gradient(to bottom, #fb83fa 0%, #e93cec 100%);
}
于 2014-10-04T12:50:38.190 回答