SASS `url()` 中的变量

Question

我有一个变量，它是图像路径的字符串：

$loader-path: "assets/loader.png";

我正在尝试使用此变量作为背景，但是，我一直收到错误消息：

Module not found: Error: Can't resolve "assets/loader.png"

这是我的 SASS 的样子：

$loader-icon: "assets/loading.png";

.inputLoader{
  background-image: url($loader-icon); // also tried url(#{$loader-icon})
  width: 24px;
  height: 24px;
  margin-left: -96px;
}

下面的我也试过了，Compass指出的是：

background-image: image-url($loader-icon);

上面只是打印了image-url(assets/loading.png)

Answer 1

您需要在路径变量中添加 / 以使其成为绝对路径。
该错误表明罗盘无法找到您链接到的资源。

因此，您的变量将如下所示：

$loader-icon: "/assets/loading.png";

SASS `url()` 中的变量

SASS Variable in `url()`

webpack

sass

compass-sass