Rails 4.0.0 jQuery Mobile button icons not showing in production

杀马特。学长 韩版系。学妹 提交于 2019-12-24 03:08:08

问题


I have decided to host my own jQuery mobile files as the gem jquery_mobile_rails only includes version 1.3.0 while I want to ensure I always have the latest version of jQM. This proved surprisingly easy as i just added the js file under javascripts and the css under stylesheets in my assets folder.

I copied the icon buttons to both /assets/images and to /assets/stylesheets/images. They are displayed properly in development but not in production. My console is showing the images being precompiled.

I have the following in production.rb

config.assets.precompile += %w(*.png *.jpg *.jpeg *.gif application-print.css)

回答1:


Whereas Rails 3.2 would generate both a fingerprinted (picture-df71a1234da231a124a.png) and non-fingerprinted (picture.png) asset during precompilation, Rails 4 no longer generates non-fingerprinted versions.

Most likely, the CSS file from jQuery Mobile contains references such as this:

background-image: url(images/icons-18-white.png)

The problem being that the CSS file has no clue what the fingerprint should be. The best solution would be to use Rails' asset path helpers. First, make sure the file is an SCSS file (just rename it so it's something like jquery.mobile-1.3.1.css.scss). This will tell rails to compile it using Sass.

Next, change all of the url(...) entries in the css file to image-url(...). Make sure to add quotes around the path. For example, this would load the file at app/assets/images/images/icons-18-white.png (which becomes public/assets/images/icons-18-white.png in production).

background-image: image-url("images/icons-18-white.png")

Upon deploying these changes, the jQuery mobile css file should get precompiled and the resulting file should include the proper fingerprinted URLs.



来源:https://stackoverflow.com/questions/17383506/rails-4-0-0-jquery-mobile-button-icons-not-showing-in-production

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!