sass - 想知道 LESS 转义的 SCSS 等价物是什么？

Question

我正在将样式表从 LESS 转换为 SCSS，并且在大多数情况下它进行得很顺利，但有一个问题:我似乎无法让我的一个 mixin 工作。

基本上我还没有完全加入 html5 潮流，我仍然使用图像作为浏览器兼容性的渐变。

我编写了一个 PHP 脚本来动态生成渐变(是的，并缓存它们!)然后 LESS 负责在调用 mixin 时链接到它。

无论如何，
我的旧 mixin(来自 LESS):

.verticalGradient(@startColor, @endColor, @height){
    @tmpStartColor: escape("@{startColor}");
    @tmpEndColor: escape("@{endColor}");
    background: @endColor url('@{img_path}gradient/v/5px/@{height}/@{tmpStartColor}/@{tmpEndColor}.png') 0 0 repeat-x;

}

到目前为止，我的新 mixin (SCSS) 是这样的:

@mixin verticalGradient($startColor, $endColor, $height){
  background: $endColor url('#{$img_path}gradient/v/5px/' + $height + '/' + $startColor + '/' + $endColor + '.png') 0 0 repeat-x;
}

所以这里的问题是:
没有被转义，网址最终是这样的:

/img/gradient/v/5px/25px/transparent/#ffe4c4.png

应该是:

/img/gradient/v/5px/25px/transparent/%23ffe4c4.png

当然，因为hash标签，服务器最多只能看到transparent/，所以无法获取颜色信息。

如果可以的话，剥离哈希标签是一个可以接受的解决方案(虽然我更喜欢像以前那样逃避它们)，但我似乎找不到任何方法来做到这一点。

谢谢!

Answer 1

我想通了。

这让我指出了正确的方向:
How do I load extensions to the Sass::Script::Functions module?

这让我完成了剩下的工作:
http://sass-lang.com/documentation/Sass/Script/Functions.html#adding_custom_functions

如果这对其他人有用，这是我的代码:)
config.rb(需要库):

require File.dirname(__FILE__) + "/lib/urlencode.rb"

库/urlencode.rb:

module Sass::Script::Functions
  def urlencode(string)
    Sass::Script::String.new(ERB::Util.url_encode(string));
  end
  declare :urlencode, :args => [:string]
end

然后这只是在我的样式表中实现的问题:

@mixin verticalGradient($startColor, $endColor, $height){
  background: $endColor url('#{$img_path}gradient/v/5px/' + $height + '/' + urlencode($startColor) + '/' + urlencode($endColor) + '.png') 0 0 repeat-x;
}