5

我有几个 CSS 文件,它们使用相对路径(如url( "../img/my_image.jpg" ).

一切都developmentproduction环境中工作,因为所有 CSS 文件都打包在一个文件中并且结构丢失了,相关路径也丢失了,并且找不到图像。

我的结构细节

我有这样的资产结构:

/app
  /assets
    /plugins
      /my_plugin
        /img
          my_image.jpg
        /css
          my_css.css

/my_plugin可以是任何一组插件cssjs以及imagesTwitter Bootstrap 之类的任何其他文件)

进入/app/assets/plugins/my_plugin/my_css.css我有类似的东西:

background-image: url("../img/my_image.jpg");

/app/assets/stylesheets/application.css

*= require css/my_css.css

最后在head我的html文件中:

<%= stylesheet_link_tag "application" %>

我应该怎么做才能解决这个问题?

更新

重现问题的迷你应用程序,在README中有安装和重现问题的说明。

4

2 回答 2

8

我没有看到连接 CSS 文件的问题。而且您不必手动包含深度嵌套的 CSS 文件:默认情况下,application.css 已经在该行中执行此操作*= require_tree .

图像会重复你的app/assets/images结构。要在开发和生产环境中正确处理它们,您有各自的指南。检查其第2.2 节 Coding Links to Assets。有关于图像文件的编码路径的解释:

通过 ERb 的 CSS:

 url(<%= asset_path 'image.png' %>)

通过 Sass 的 CSS:

 image-url("rails.png")

预编译图像末尾的所有这些奇怪的十六进制字符都将自动得到尊重。

UPD

我看到您根本不需要插件的资产管道功能。您的样式/脚本已经缩小。您可以将plugins文件夹移动到您的public文件夹中(成为<APP_ROOT>/public/plugins/)。

然后从您的删除以下行application.css

*= require bootstrap/css/bootstrap

而是将以下行添加到您的模板中application.html.erb

  <%= stylesheet_link_tag    "/plugins/bootstrap/css/bootstrap.min.css", :media => "all" %>
  <%= javascript_include_tag "/plugins/bootstrap/js/bootstrap.min.js" %>

现在您必须能够通过替换您public/plugins/bootstrap的内容轻松地在您的主题之间切换。

更新 2

可能你必须明确告诉Railsprecompile你的插件资产

# /config/environments/production.rb
config.assets.precompile += %w( bootstrap/css/bootstrap.css )
于 2012-09-02T14:16:38.497 回答
2

我已经能够解决将我的插件资产移动到/app/vendor/assets/plugins我认为更好的地方的问题,因为它们不是与我的应用程序直接相关的资产,而是事实上的供应商资产。

然后我们有:

/app
  /vendor
    /assets
      /plugins
        /my_plugin
          /img
            my_image.jpg
          /css
            my_css.css

css我们在另一个stylesheet_link_tag调用中加载 main ,如下所示:

<%= stylesheet_link_tag "my_plugin/css/my_css", :media => "all" %>

此时一切看起来都正常,但Rails抱怨my_css.css即使我们运行也没有编译rake assets:precompile

解决方案是明确告诉Rails编译这个文件:

# /config/environments/production.rb
config.assets.precompile += %w( my_plugin/css/my_css.css )

现在rake assets:precompile将编译我们的插件 css 并且production环境即使使用相对 urls也能正常工作。

检查已解决问题的差异更改

于 2012-09-02T19:40:50.613 回答