18

在第 2.2.2 节“CSS 和 Sass”中，我被告知要放入image-url('delete.png')我的 sass。所以我有。

但是，它正在生成 CSS

background-image: url(/images/delete.png)

而不是我在任何地方都被告知它应该生成的东西，正确而明显的东西，

background-image: url(/assets/delete.png)

什么。见鬼。

我花了几天的时间试图弄清楚这是从哪里来的。

以下是导致此行为的相关设置的要点。这是我们代码库早期版本中相同文件的要点（就在我们实施资产管道之后，它实际上工作了大约一周，然后才出现这种令人沮丧的行为）。你能发现差异吗？您能想到的任何其他文件可能会导致这种情况吗？

笔记

  • 我们故意使用旧版本，sass-rails因为新版本Stack level too deep!在预编译时会导致错误。
  • 我们正在使用指南针。

变通办法的两次骇人听闻的尝试

因为实际上对资产管道进行故障排除有点糟糕。

1：将图片放入/images

我试图将所有图像移动到public/images并将其添加为加载路径。这在开发中有效（图像可在/assets或中访问/images），但生产的预编译仅将指纹图像放入/assets（obvs），因此当 sass-rails 放入时url(/imagse/delete-120398471029384102364.png)，无法找到它。

2：使 /public/images 成为 /public/assets 的符号链接

这可能在生产中有效，但在开发中 /assets 文件夹不存在，因此url(/images/delete.png)指令会导致找不到图像。

4

8 回答 8

10

如果你还没有这个，命名你的 css 文件*.css.scss（而不是.sass- 如果你这样做，你可能需要调整一些语句的语法）。然后使用image_pathhelper 代替image-path，例如：

background-image:url(image_path('delete.png'));

我希望这可以解决您的问题。如果没有，这种方法为您生成的资产路径是什么？

于 2012-06-21T15:57:29.240 回答
8

这似乎是由于您的 sass-rails (3.1.0) 版本。我可以重现您的问题（感谢您发布 Gemfile），并且在遇到 sass-rails 3.1.4 时它会消失。

尝试升级到 3.1.4 并清除tmp/cache. 还要确保您没有访问任何浏览器缓存。

我知道你说 3.1.4 引起了其他问题……你试过更高版本吗？

于 2012-06-24T01:12:56.487 回答
2

看起来确实像这个问题：https ://github.com/rails/sass-rails/issues/57 如果是这样，您应该尝试在 Compass 和 Sass-rails 之间找到良好的版本组合。

也许将所有东西（包括 Rails）升级到最新版本，这仍然是最好的方法（使用bundle outdatedbundler 1.2 中的命令来了解要升级的 Gems）

于 2012-06-20T21:41:53.603 回答
2

这是我们的 haml-rails、compass 和 sass-rails 的组合。不过，我们正在运行 rails 3.2.6。这对我们来说效果很好。

宝石'指南针'，git：'git：//github.com/chriseppstein/compass.git'，参考：'3a4c5c75dca9f07f6edf2f0898a4626269e0ed62'

宝石'haml-rails'，git：'git：//github.com/indirect/haml-rails.git'，参考：'92c41db61f20a9f122de25bc73e5045cfccdbcd5'

gem 'sass-rails', '~> 3.2.5'

于 2012-06-20T21:50:55.413 回答
0

健全性检查您当前资产管道中的文件。检查它是否在此处列出的目录之一中：

<%= debug Rails.application.config.assets.paths %>

接下来检查 compass 期望找到图像的相对路径（并查看它是否匹配。根据Compass config docs，其中一个应该告诉您：

<%= debug config.compass.http_images_path %>
<%= debug config.compass.http_generated_images_path %>

我猜这是第一个。无论哪种方式，将它们的路径与图像的asset_path进行比较：

<%= debug asset_path 'delete.png' %>

如果路径不匹配，您可能需要将环境配置（development.rb，...）中的路径调整为此，例如：

config.compass.http_images_path = '/assets.

或者，您可以将图像移动到 http_images_path 或 http_generated_images_path 期望找到它的位置。

此时，asset_path/asset_url（比硬编码要脆弱得多）应该可以工作。我基于我在样式表中看到的类似技术，

于 2012-06-28T00:12:17.613 回答
0

不一定是一个解决方案，但肯定是一个可用的选项：如果您愿意使用指南针精灵，您将减少 http 请求的数量并能够使用精灵图手动指定您的图像路径，即 '$sprites : sprite-map("PATH/*.png");'

于 2012-06-26T14:25:53.927 回答
0

为了我，

转为工作。image_path_ 后来，我再次更改为，现在工作正常。image-path.scssimage_path

删除缓存对我没有帮助。

于 2013-10-19T19:14:36.337 回答
-2

在我编辑了我的 .scss 文件（添加了一个空格）并重新加载页面后，我得到了正确的结果。删除空间后，它可以正常工作。

于 2014-11-02T12:55:13.950 回答