css - Lesshat .background-image对我不起作用

我试图用lesshat工作。我已经将lesshat.less mixins库文件上传到我的项目根文件夹。并仅使用一个选择器和mixin调用创建了1个.less文件-lesshat-tests.less。

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

我试图使用Webstorm less css编译器插件，并使用node.js模块less命令lessc来编译该文件。 Lessc制作了一个空文件，webstorm插件生成错误，提示该插件无法评估JS函数。

我看到了使用某些功能的mixin。但是我无法获得有关在更少的内部使用JS的任何信息。
请帮帮我。

最佳答案

Lesshat的大多数mixin用Javascript编写。 less编译器本身也是用JavaScript编写的，并在Less代码中评估位于反引号之间的本机JavaScript调用。

您的Webstorm较少的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%);
}