[英]Gliphs not showing up properly on an Ubuntu Rails 4.1 installation
On my development machine: 在我的开发机器上:
Windows 8.1
Ruby 2.0
Rails 4.1
Bootstrap 3
On my production machine: 在我的生产机器上:
Ubuntu 12.4
Ruby 2.1.1
Rails 4.1
Bootstrap 3
Here's my code: 这是我的代码:
<td>
<%= link_to my_model, class: 'btn btn-info' do %>
<span class="glyphicon glyphicon-search"></span>
<% end %>
</td>
<td>
<%= link_to [:edit, my_model], class: 'btn btn-warning' do %>
<span class="glyphicon glyphicon-pencil"></span>
<% end %>
</td>
<td>
<%= link_to my_model, method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger' do %>
<span class="glyphicon glyphicon-remove"></span>
<% end %>
</td>
The gliphs show up fine on my development machine, but not on the production machine. 这些故障现象在我的开发机器上显示正常,但在生产机器上却没有。 Images attached. 附有图像。 Any ideas? 有任何想法吗?
I forgot to add that I precompile as follows: 我忘了补充说,我的预编译如下:
RAILS_ENV=production bundle exec rake assets:precompile
Here's what firebug says when I inspected these elements. 这是我检查这些元素时Firebug所说的。 They are the same: 他们是一样的:
Firebug inspection for production: 萤火虫生产检查:
<td>
<a class="btn btn-info" href="/agents/1">
<span class="glyphicon glyphicon-search"></span>
</a>
</td>
Firebug inspection for development: Firebug开发检查:
<td>
<a class="btn btn-info" href="/agents/1">
<span class="glyphicon glyphicon-search"></span>
</a>
</td>
It looks like I was dealing with a known Rails 4.1 issue. 看来我在处理一个已知的Rails 4.1问题。 The solution is to: 解决方案是:
Have the following set in environments/production.rb: 在environment / production.rb中进行以下设置:
config.assets.compile = true config.assets.compile = true
Precompile assets as follows: 预编译资产如下:
RAILS_ENV=production bundle exec rake assets:precompile RAILS_ENV =生产捆绑执行佣金资产:预编译
Precompiling the assets will prevent dynamnic asset re-compilation. 预编译资产将防止动态资产重新编译。 I tested it and it now works on my ubuntu 4.1 server 我测试了它,现在可以在我的ubuntu 4.1服务器上使用
There could be a number of issues causing this: 可能有许多问题导致此:
-- -
Precompilation 预编译
The primary issue here will likely be precompilation : 这里的主要问题可能是预编译 :
By default Rails assumes assets have been pre-compiled and will be served as static assets by your web server. 默认情况下,Rails假定资产已经过预编译,并且将被Web服务器用作静态资产。
Precompiling Rails assets is the bane of many Heroku-bound apps (I know you're not using Herou), as many people don't factor in their pre-compilation requirements when designing their asset pipeline. 预编译Rails资产是许多受Heroku绑定的应用程序的祸根(我知道您没有使用Herou),因为许多人在设计资产管道时并未考虑其预编译要求。
The problem you probably have is your assets are either not precompiled, or are referencing their "dynamic" filenames, rather than their "static" ones 您可能遇到的问题是资产未预编译,或者正在引用其“动态”文件名,而不是其“静态”文件名
I would personally precompile your assets before deploying to production: 在部署到生产环境之前,我会亲自对您的资产进行预编译:
$ rake assets:precompile RAILS_ENV=production
- -
Fingerprinting 指纹
When you precompile your assets, Rails performs something called fingerprinting
- basically where Rails will append a hash to the end of the filename 当您对资产进行预编译时,Rails会执行称为fingerprinting
-基本上,Rails会将哈希添加到文件名的末尾
Another issue for many people is they'll reference the "static" filename using something like the following: 对于许多人来说,另一个问题是他们将使用如下所示的名称来引用“静态”文件名:
#app/assets/stylesheets/application.css
.style {
background: url("your_image.png");
}
The problem here is although this will work in development (where assets are referenced statically), you will have a problem in production. 这里的问题是,尽管这将在开发中起作用(在其中静态引用资产),但在生产中会遇到问题。 To fix this, you'll need to use some of the Rails CSS pre-processors (SASS) : 要解决此问题,您需要使用一些Rails CSS预处理器(SASS) :
#app/assets/stylesheets/application.css
.style {
background: asset_url("your_image.png");
}
-- -
Fix 固定
In reference to your issue directly, I would say the main problem you're likely not referencing your CSS files correctly, probably with incorrect paths. 直接提到您的问题,我想说的主要问题是您可能没有正确引用CSS文件,可能是路径不正确。
I would firstly look at the developer console
in your browser - this will likely tell you that you don't have the various CSS files available, to which you'll then be able to try precompiling & referencing the glyphs dynamically to see if that will work 首先,我将在浏览器中查看developer console
-这可能会告诉您您没有可用的各种CSS文件,然后您可以尝试对其进行预编译和动态引用这些字形,以查看是否会工作
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.