Images desapears after deploy Rails 3.1.3 on Heroku Cedar

问题

After deploy on heroku cedar, images desapear.

I've a CSS like :

:css
  /* */
  table.table thead .sorting { background: url('assets/datatables/sort_both.png') no-repeat center right; }
  table.table thead .sorting_asc { background: url('assets/datatables/sort_asc.png') no-repeat center right; }
  table.table thead .sorting_desc { background: url('assets/datatables/sort_desc.png') no-repeat center right; }
  /* */
  table.table thead .sorting_asc_disabled { background: url('assets/datatables/sort_asc_disabled.png') no-repeat center right; }
  table.table thead .sorting_desc_disabled { background: url('assets/datatables/sort_desc_disabled.png') no-repeat center right; }

and relative png into app/assets/images/datatables/Locally works, but not on Heroku.

I could also use = asset_tag('datatables/icon.png') ..., but how to do it inside CSS ?

I've also tried config.action_dispatch.x_sendfile_header = nil in config/environments/production.rb without success.

回答1:

In the production environment the assets will have an MD5 thumbprint appended to their URL. It is important that you use the asset path helpers so that the right filename is used.

It appears that you are using Haml, based on the :css filter.

In Haml you can interpolate Ruby into the doucment with #{ ruby }

:css
  table.table thead .sorting { background-image: url(#{ asset_path('datatables/sort_both.png')}) }
  ... and so on.

If you are using Sass/SCSS, you can use the built in asset helpers.

table.table thead .sorting { 
  background-image: asset-url('datatables/sort_both.png');
}

Its a little more complicated if you are using plain CSS. You'll need to append .erb to the css file. ('assets/stylesheets/file.css.erb')

table.table thead .sorting {
  background-image: url(<%= asset_path('datatables/sort_both.png') %>);
}

You should use Sass or SCSS. Its the cleanest and leanest.

回答2:

I just got it working myself.

The key is putting this line in your application.rb:

config.assets.initialize_on_precompile = false

Are you using the jquery-datatables-rails gem? If not, you should! Put this line in your gemfile:

gem 'jquery-datatables-rails', github: 'rweng/jquery-datatables-rails'

and run:

bundle install

NOTE: Don't put it in your assets group or it will not work when deploying to heroku (since the assets group is not used in production).

Also, make sure to put this line in your application.rb (sorry to repeat, but its important):

config.assets.initialize_on_precompile = false

Add these to your application.js

//= require dataTables/jquery.dataTables
//= require dataTables/jquery.dataTables.bootstrap

Add this to your application.css:

 *= require dataTables/jquery.dataTables.bootstrap

And add this to your js.coffee file for your controller you are using datatables in:

If you are using fluid containers:

#// For fluid containers
$('#dashboard').dataTable({
  "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>",
  "sPaginationType": "bootstrap"
});

If you are using fixed width containers:

#// For fixed width containers
$('.datatable').dataTable({
  "sDom": "<'row'<'span6'l><'span6'f>r>t<'row'<'span6'i><'span6'p>>",
  "sPaginationType": "bootstrap"
});

来源：https://stackoverflow.com/questions/9439562/images-desapears-after-deploy-rails-3-1-3-on-heroku-cedar

标签

ruby-on-rails

ruby-on-rails-3.1

heroku

asset-pipeline