ruby-on-rails - 在 sass 中使用 image-url 来避免硬编码图像资产路径

Question

我刚刚开始使用 Rails 资产管道，我是前端人员。我正在尝试在 sass 文件中使用 image-url 帮助程序，这样我就不必对路径进行硬编码。

以下SASS

.some-class
  background: image-url("image.png")

生成以下CSS

.some-class{
  background: url("asset/image.png");
}

如何使用 image-url 帮助程序生成以下 css，而不对图像路径进行硬编码？

.some-class{
  background: url("asset/image.png") no-repeat 0 0 #fff;
}

score 0 · Accepted Answer

您可以使用，

.some-class
  background-image: image-url("image.png")
  background-repeat: no-repeat;
  background-color: #fff;

等等。

或者

 background: #fff image-url("image.png") no-repeat 0 0;

应该管用。

score -1 · Accepted Answer

您可能应该使用：

background-image: asset-url("image.png", image) no-repeat 0 0 #fff;

assets-url 是一个 sass/rails 功能，它可以让资产管道为你做一些（生产）工作。您可以在此处阅读有关该功能的信息。

使用 helper 比使用 plain 更可取url("image.png")，因为它可以在生产中为您提供指纹 URL。请参阅此 StackOverflow 答案。

2 回答 2