Sass 插值不起作用

【问题标题】：Sass interpolation doesn't workSass 插值不起作用
【发布时间】：2017-09-19 10:19:54
【问题描述】：

如何在 url 中转义变量？似乎 this 和 this 变体不起作用

@include image("R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=")

@mixin image($base64)
    background: url(data:image/gif;base64,#{$base64}) //this is line N
    //background: url("data:image/gif;base64,#{$base64}")

（第 N 行：属性只允许在规则、指令、mixin 中使用包括，或其他属性。）

我试过 sass 3.4.22 和 3.5.0-rc.1

【问题讨论】：

标签： sass

【解决方案1】：

错误消息告诉您background 属性需要由指定选项之一包装。

@mixin image($base64)
  background: url(data:image/gif;base64,#{$base64})

.class
  @include image("R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=")

编译成

.class {
  background: url(data:image/gif;base64,R0lGODlhAQABAIAAAAUEBAAAACwAAAAAAQABAAACAkQBADs=);
}

使用 SassMeister 和 Sass v3.4.21。我不得不改变 mixin 定义的顺序和它的使用来使编译工作。我不知道这是否只是一个编译器的事情，它可能对你有用。

【讨论】：