2013-11-20 42 views
2

我創建了一個簡單的應用程序,我有這在我的application.css文件:軌道4背景圖片 - 純CSS

/* 
* This is a manifest file that'll be compiled into application.css, which will include all the files 
* listed below. 
* 
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets, 
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path. 
* 
* You're free to add application-wide styles to this file and they'll appear at the top of the 
* compiled file, but it's generally better to create a new file per style scope. 
* 
*= require_self 
*= require_tree . 
*/ 
html { 
    background-image: url(/assets/homepage_bg_1.jpg); 
} 

現在我使用的WEBrick,並在發展模式,它工作正常。現在問題出現在生產模式下,壁紙不顯示。

我已經跑:

rake assets:precompile 
rails -s -e production 

,圖像不會出現。

我已經試過background-image: url(/assets/images/homepage_bg_1.jpg);等etc等,但沒有。

這是我的生產環境中的文件:

Properties::Application.configure do 
    # Settings specified here will take precedence over those in config/application.rb. 

    # Code is not reloaded between requests. 
    config.cache_classes = true 

    # Eager load code on boot. This eager loads most of Rails and 
    # your application in memory, allowing both thread web servers 
    # and those relying on copy on write to perform better. 
    # Rake tasks automatically ignore this option for performance. 
    config.eager_load = true 

    # Full error reports are disabled and caching is turned on. 
    config.consider_all_requests_local  = false 
    config.action_controller.perform_caching = true 

    # Enable Rack::Cache to put a simple HTTP cache in front of your application 
    # Add `rack-cache` to your Gemfile before enabling this. 
    # For large-scale production use, consider using a caching reverse proxy like nginx, varnish or squid. 
    # config.action_dispatch.rack_cache = true 

    # Disable Rails's static asset server (Apache or nginx will already do this). 
    config.serve_static_assets = false 

    # Compress JavaScripts and CSS. 
    config.assets.js_compressor = :uglifier 
    # config.assets.css_compressor = :sass 

    # Do not fallback to assets pipeline if a precompiled asset is missed. 
    config.assets.compile = false 

    # Generate digests for assets URLs. 
    config.assets.digest = true 

    # Version of your assets, change this if you want to expire all your assets. 
    config.assets.version = '1.0' 

    # Specifies the header that your server uses for sending files. 
    # config.action_dispatch.x_sendfile_header = "X-Sendfile" # for apache 
    # config.action_dispatch.x_sendfile_header = 'X-Accel-Redirect' # for nginx 

    # Force all access to the app over SSL, use Strict-Transport-Security, and use secure cookies. 
    # config.force_ssl = true 

    # Set to :debug to see everything in the log. 
    config.log_level = :info 

    # Prepend all log lines with the following tags. 
    # config.log_tags = [ :subdomain, :uuid ] 

    # Use a different logger for distributed setups. 
    # config.logger = ActiveSupport::TaggedLogging.new(SyslogLogger.new) 

    # Use a different cache store in production. 
    # config.cache_store = :mem_cache_store 

    # Enable serving of images, stylesheets, and JavaScripts from an asset server. 
    # config.action_controller.asset_host = "http://assets.example.com" 

    # Precompile additional assets. 
    # application.js, application.css, and all non-JS/CSS in app/assets folder are already added. 
    # config.assets.precompile += %w(search.js) 

    # Ignore bad email addresses and do not raise email delivery errors. 
    # Set this to true and configure the email server for immediate delivery to raise delivery errors. 
    # config.action_mailer.raise_delivery_errors = false 

    # Enable locale fallbacks for I18n (makes lookups for any locale fall back to 
    # the I18n.default_locale when a translation can not be found). 
    config.i18n.fallbacks = true 

    # Send deprecation notices to registered listeners. 
    config.active_support.deprecation = :notify 

    # Disable automatic flushing of the log to improve performance. 
    # config.autoflush_log = false 

    # Use default logging formatter so that PID and timestamp are not suppressed. 
    config.log_formatter = ::Logger::Formatter.new 
end 

是CSS損壞或東西在軌道4,5?

+0

作出這樣_style.css.erb_一個新的CSS文件,把文件'application.css'改成'application.css.scss',然後使用下面的命令:<%{asset_path(「homepage_bg_1.jpg」)%>');}' – Vucko

+2

'background-image:image-url('homepage_bg_1.jpg')' – Thanh

回答

1

幾天前,我遇到了同樣的問題,我問自己爲什麼。沒有問題,但Rails已經改變了編譯資產映像的方式。

這裏我的解決辦法:

首先要確保你沒有忘記編譯生產資產:在你public/assets文件夾

RAILS_ENV=production bundle exec rake assets:precompile

看,你會發現,編譯後您的圖像的名字是這樣的:

homepage_bg_1-12cf3e4fe243f4296a4b23b952497814.jpg

Rails已經對資產進行了版本管理,我假設要緩存映像並優化服務器和客戶端之間的響應時間。

我的解決方案的下一步是使用asset_path("homepage_bg_1.jgg", image)助手在你的CSS代碼,這就是爲什麼你需要重命名custom.css文件custom.css.scss,後來你的CSS代碼將是這樣的:

.my_class{ background-image: url(asset_path("homepage_bg_1.jpg", image)); }

除此之外,您還需要在你的HTML的ERB/HAML意見image_path在使用與image_tag組合或直接在你的HTML的圖像標籤:

image_tag(image("logo.png"))<image src="<%= image_path(logo.png'') %>" \>

你可以閱讀更多關於這個幫手和其他在這裏: http://api.rubyonrails.org/classes/ActionView/Helpers/AssetUrlHelper.html#method-i-asset_path

+0

抱歉沒有任何建議工作。 –

+0

粘貼您的CSS代碼並確認您的圖片是否在'app/assets/images /' – hernanvicente