是否可以故意不使用/关闭 Compass Url Helpers?
Is it possible to not use / turn off Compass Url Helpers on purpose?
我在尝试覆盖我导入的另一个 .scss 文件中的某些值时遇到了这个问题。
具体来说,我想在我的项目中使用 slick slider。
所以我继续,下载源代码并导入该代码。
此外,为了让光滑的滑块在我的设置中工作,我必须通过变量覆盖给它自己的位置。
所以最后我有这样的事情:
$slick-font-path: "../bower_components/slick-carousel/slick/fonts/";
$slick-loader-path: "../bower_components/slick-carousel/slick/";
@import "../../bower_components/slick-carousel/slick/slick";
@import "../../bower_components/slick-carousel/slick/slick-theme";
到目前为止没有什么特别的。
当我发现这行不通时,有趣的部分就开始了,因为一些聪明的人显然想充分发挥指南针的潜力,并在光滑的 .scss code:
中添加了以下行
@function slick-image-url($url) {
@if function-exists(image-url) {
@return image-url($url);
}
@else {
@return url($slick-loader-path + $url);
}
}
.slick-list {
.slick-loading & {
background: #fff slick-image-url("ajax-loader.gif") center center no-repeat;
}
}
你不能责怪他们,因为这是 IMO 解决这种情况的正确且非常有效的方法。当罗盘看到此代码时,它将检查 config.rb
中的目录配置并在其中使用指定的路径,因为 image-url() 是一个 Url 助手。
然而,问题是当我不想使用它时,我找不到不使用或取消设置该功能的方法。 (默认为“/images”)
在 config.rb 中设置图像路径也无济于事,我想这不会使该功能以某种神奇的方式消失。
最后,我的解决方案是重写该函数,如下所示:
@function image-url($url) {
@return url($slick-loader-path + $url);
}
但这当然会给您带来麻烦,因为您之后必须使用其他实际上应该使用 config.rb 中的位置的代码。必须有更好的解决方案。
image-url() 函数是在 Ruby 中编写的,这意味着它被注入到 Sass 本身并且与任何其他标准函数的行为相同(请注意,Compass 只是Sass 周围的精美包装)。您始终可以使用此功能,而无需导入任何内容(与 Sass 中编写的功能不同)。这也意味着如果你覆盖它,就没有办法找回原来的版本。
如果第 3 方库不恰当地引用了这个函数,那么如果您不愿意自己修补它,您应该向他们请求修复。
我在尝试覆盖我导入的另一个 .scss 文件中的某些值时遇到了这个问题。
具体来说,我想在我的项目中使用 slick slider。
所以我继续,下载源代码并导入该代码。
此外,为了让光滑的滑块在我的设置中工作,我必须通过变量覆盖给它自己的位置。
所以最后我有这样的事情:
$slick-font-path: "../bower_components/slick-carousel/slick/fonts/";
$slick-loader-path: "../bower_components/slick-carousel/slick/";
@import "../../bower_components/slick-carousel/slick/slick";
@import "../../bower_components/slick-carousel/slick/slick-theme";
到目前为止没有什么特别的。
当我发现这行不通时,有趣的部分就开始了,因为一些聪明的人显然想充分发挥指南针的潜力,并在光滑的 .scss code:
@function slick-image-url($url) {
@if function-exists(image-url) {
@return image-url($url);
}
@else {
@return url($slick-loader-path + $url);
}
}
.slick-list {
.slick-loading & {
background: #fff slick-image-url("ajax-loader.gif") center center no-repeat;
}
}
你不能责怪他们,因为这是 IMO 解决这种情况的正确且非常有效的方法。当罗盘看到此代码时,它将检查 config.rb
中的目录配置并在其中使用指定的路径,因为 image-url() 是一个 Url 助手。
然而,问题是当我不想使用它时,我找不到不使用或取消设置该功能的方法。 (默认为“/images”)
在 config.rb 中设置图像路径也无济于事,我想这不会使该功能以某种神奇的方式消失。
最后,我的解决方案是重写该函数,如下所示:
@function image-url($url) {
@return url($slick-loader-path + $url);
}
但这当然会给您带来麻烦,因为您之后必须使用其他实际上应该使用 config.rb 中的位置的代码。必须有更好的解决方案。
image-url() 函数是在 Ruby 中编写的,这意味着它被注入到 Sass 本身并且与任何其他标准函数的行为相同(请注意,Compass 只是Sass 周围的精美包装)。您始终可以使用此功能,而无需导入任何内容(与 Sass 中编写的功能不同)。这也意味着如果你覆盖它,就没有办法找回原来的版本。
如果第 3 方库不恰当地引用了这个函数,那么如果您不愿意自己修补它,您应该向他们请求修复。