Rails 4 Image fail in production

Hello,

Just upgraded to rails 4 and Bootstrap 3. Everything working fine
except the following line in assets/javascripts/questions.js.coffee:

$(’#jumbotron’).css(‘background-image’ :‘url(“assets/Jumbotron2.png”)’)

Works in development but not production on Heroku. Image just does not
show up on Heroku.

Tried $(’#jumbotron’).css(‘background-image’ :url(<%= asset_path
‘Jumbotron2.png’ %>))
which also worked in dev but not production. Changing application.js to
application.js.erb crashed heroku.

Any ideas?

Thanks,
Dave C.

On Monday, March 17, 2014 9:08:53 PM UTC-4, Ruby-Forum.com User wrote:


Posted via http://www.ruby-forum.com/.

Yes. That’s going to be an issue. I’m not sure I can explain it well,
but
whenever you reference assets/ or asset_path, it needs to resolve that
through sprockets. In production, all assets are pre-compiled and
sprockets isn’t loaded. when you use javascript to change the css to
reference an asset_path, there’s no resolution. This doesn’t happen in
development because assets aren’t precompiled and these paths can be
resolved after changes to the css by javascript.

I would probably put the image in public/images/Jumbotron2.png and
change
your code the the following:

$(‘#jumbotron’).css(‘background-image’ :‘url(“images/Jumbotron2.png”)’)

On Tuesday, March 18, 2014 8:01:48 AM UTC-4, Ruby-Forum.com User wrote:

environments.

Thanks,

Dave


Posted via http://www.ruby-forum.com/.

sorry, it should have started with the root relative. i tested this and
it
works, but the rest of your syntax threw an error, probably because I
don’t
use coffee. This is the line that worked for me:

$(‘#jumbotron’).css(‘background-image’ ,
‘url(“/images/Jumbotron2.png”)’)

note that the colon between ‘background-image’ and ‘url …’ is now a
comma. The path to the image now starts with a slash. This is the
jquery
form. The other format you have with a colon may work in coffee. At
any
rate, the path /images/… should work. sorry, i should have tested
this
first.

mike

On Friday, March 21, 2014 12:13:30 PM UTC-4, Rick wrote:

i would put the image in assets/images and refer to it as:
:url(“Jumbotron2.png”)

I’m hoping that Dave has already resolved this and moved on, but since a
lot of people are viewing this thread, I wanted to update it. I
re-wrote
this in coffeescript and re-tested. Just to be clear, I’m testing in
Rails
4. The pipeline treatment for images was changed with Rails 4, so it’s
likely there would be a different result if you’re running in Rails 3.1
or
3.2. Also, my production environment is the default production
environment
and assets are pre-compiled.

Dave’s original reference of ‘assets/Jumbotron2.png’ worked in
development,
but not in production, the same result he had.

The second solution of putting the image in public/imagesJumbotron2.png
and
referencing ‘/images/Jumbotron.png’ worked in both production and
development. FYI, the colon also worked when I re-wrote in
Coffeescript.

The third solution from Rick to reference url(“Jumbotron2.png”) was a
little surprising. I had expected it to work in development and not in
production. It actually didn’t work in either one. In production, it’s
not
working for the same reason as Dave’s original statement. The pipeline
doesn’t load in production so it either finds the image somewhere in the
public directory or it doesn’t load. In development, I have learned
that
you must either use a helper (such as asset_path) or you must reference
the
assets/ directory as Dave did to trigger the pipeline processing.
Didn’t
know that.

i would put the image in assets/images and refer to it as:
:url(“Jumbotron2.png”)