我最近重写了我的Rails 3.2.13应用程序以使用Rails 4.我在我的Rails 3应用程序中使用了twitter-bootstrap-rails 2.1.2.当我重写Rails 4版本时,它开始使用版本2.2.8.我在开发和生产服务器上使用Phusion Passenger 4.0.20托管所有的Rails应用程序.
在我的Rails 3应用程序中,背景图像在本地主机和生产中正确显示.但是,当我使用Rails 4和当前版本的twitter-bootstrap-rails重写了应用程序时,我注意到背景图像正确显示,但是当我在部署它的时候,它不会显示背景图像.
我尝试了以下CSS,但是背景图像只出现在localhost中.第一个声明是原始的CSS代码,在本地主机和生产中的Rails 3应用程序中运行良好.
background: url(/assets/landingpage2.jpg); width: 574px; height: 650px;
background: url(../assets/landingpage2.jpg); width: 574px; height: 650px;
background-image: url(../assets/landingpage2.jpg); width: 574px; height: 650px;
background-image: url("../assets/landingpage2.jpg"); width: 574px; height: 650px;
background-image: url("/assets/landingpage2.jpg"); width: 574px; height: 650px;
这是包含最初工作的背景语句的类：
.landing-cube-menu {
font-weight: bold;
font-size: 150%;
line-height: 100%;
background: url(/assets/landingpage2.jpg); width: 574px; height: 650px;
margin:0 auto;
}
这是我在视图中使用的代码：
<div class="header-cube-menu" style="position: relative;">
<div class="header-store" style="position: absolute;">
<p><%= link_to "Online Store",store_path %></p>
</div>
<div class="header-about" style="position: absolute;">
<p><%= link_to "About",about_path %></p>
</div>
<div class="header-contact" style="position: absolute;">
<p><%= link_to "Contact",contact_path %></p>
</div>
<div class="header-verse" style="position: absolute;">
<p><a href="/verse">Bible<br>Verse</a></p>
</div>
<div class="header-app" style="position: absolute;">
<p><a href="/app">Mobile<br> App</a></p>
</div>
<div class="header-home" style="position: absolute;">
<p><a href="/home">Home<br> Page</a></p>
</div>
<div class="header-math" style="position: absolute;">
<p><a href="/math">The<br>Math</a></p>
</div>
<div class="header-vision" style="position: absolute;">
<p><a href="/vision"> Vision<br>Mission</a></p>
</div>
<div class="header-pendant" style="position: absolute;">
<p><a href="/pendant">Pendant<br> Desk Cross<br> and more</a></p>
</div>
<div class="header-puzzle" style="position: absolute;">
<p><a href="/puzzle">3D-Puzzle<br> eBook</a></p>
</div>
</div>
我已经在浏览器中清除了本地主机和我的域的缓存.我仍然看到本地主机中的映像,但不是域.我在Mac Mini Server上尝试使用最新版本的Safari,Chrome,Firefox和Opera.他们都得到相同的结果.
如果没有在本地主机中看到背景图像,我可以理解这一点.我使用localhost对Rails 4应用程序进行了测试,并认为它将在生产中运行.但是在部署之后,背景图像丢失.这在我的生产和开发服务器上都发生了.图像文件位于两个服务器上的app / assets / images中.
我的原始代码和我在这里发布的所有示例是正确的,因为图像显示在localhost中.我在这一点上没有线索来检查.我可以在Passenger Google Group发布.这是本地主机和生产之间唯一的其他变量,特别是考虑到我的开发服务器.
更新：我发布了这个之后决定尝试其他的可能性.现在本地主机不再显示背景图像.我完全沮丧了.
任何帮助将不胜感激.
更新10/19/2013 8:05 PM CDT GMT-5
我试图在我的.less文件中实现asset_url解决方案.以下是我做了rake资产时遇到的错误：precompile RAILS_ENV = production命令
I,[2013-10-19T19:59:05.384878 #69440] INFO -- : Writing /Users/myusername/Sites/myrailsapp/public/assets/application-f8821f5601f793a09e9373fb397df1b1.js
rake aborted!
undefined method `[]' for nil:NilClass
(in /Users/myusername/Sites/hypercubeoflove_RoR_4/app/assets/stylesheets/application.css)
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/sass_functions.rb:63:in `sprockets_context'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-rails-4.0.0/lib/sass/rails/helpers.rb:23:in `asset_url'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/script/funcall.rb:112:in `_perform'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/script/node.rb:40:in `perform'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:298:in `visit_prop'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `map'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:109:in `block in visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:121:in `with_environment'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:108:in `visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `block in visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:320:in `visit_rule'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `block in visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `map'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:53:in `visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:109:in `block in visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:121:in `with_environment'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:108:in `visit_children'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `block in visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:128:in `visit_root'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/base.rb:37:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:100:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/visitors/perform.rb:7:in `visit'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/tree/root_node.rb:20:in `render'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/engine.rb:315:in `_render'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sass-3.2.12/lib/sass/engine.rb:262:in `render'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/sass_compressor.rb:24:in `evaluate'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/tilt-1.4.1/lib/tilt/template.rb:103:in `render'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:197:in `block in evaluate'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:194:in `each'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/context.rb:194:in `evaluate'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/bundled_asset.rb:25:in `initialize'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:377:in `new'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:377:in `build_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:94:in `block in build_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/caching.rb:58:in `cache_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:93:in `build_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/base.rb:287:in `find_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/index.rb:61:in `find_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:211:in `block in find_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:257:in `benchmark'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:210:in `find_asset'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:119:in `block in compile'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:118:in `each'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/sprockets/manifest.rb:118:in `compile'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-rails-2.0.0/lib/sprockets/rails/task.rb:60:in `block (3 levels) in define'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-2.10.0/lib/rake/sprocketstask.rb:146:in `with_logger'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/gems/sprockets-rails-2.0.0/lib/sprockets/rails/task.rb:59:in `block (2 levels) in define'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/bin/ruby_noexec_wrapper:14:in `eval'
/Users/myusername/.rvm/gems/ruby-2.0.0-p247@mygemset/bin/ruby_noexec_wrapper:14:in `<main>'
Tasks: TOP => assets:precompile
(See full trace by running task with --trace)
解决方法
您的问题几乎肯定与耙资产有关：预编译&你的生产环境
一个很好的测试将是右键点击>查看您的制作应用程序的源,然后单击调用背景图像的CSS文件.如果你的问题是你的CSS调用url(“background-image.png”)&当您点击文件时,它不显示,解决方案是使用SCSS动态预编译资源
使用SCSS预编译资产
我们遇到问题,您无法访问CSS中的图像文件,发现这是因为CSS仅引用静态url()位置;在预编译中,我们的应用程序正在调用图像“backgroun-image-234234nsdfasfdjasdfk2jij234ij32i.png”
要修复的方法是到use SCSS创建到资产的动态链接;允许您的应用程序将图像的正确路径等放在一起.以下是一些实时代码：
#application.css.scss (yes,you need to rename it)
@import 'layout/body'
#app/assets/stylesheets/layout/body.css.scss
body {
background: asset_url('background-image.png')
}
如果这样做,然后当你推送到生产,你执行这些命令,它应该工作：
rake assets:precompile RAILS_ENV=production
