我已经在 Heroku 上部署了一个 rails 应用程序，并且我正在使用 twitter-bootstrap-rails gem 来包含 twitter 引导程序。一切都在本地（和开发环境中）完美运行，但在 Heroku（和生产环境中）一切正常，除了 glyphicons，它们都显示为小方块。
起初我认为这是图标精灵未预编译的问题，因此在我的 gemfile 中，我将“gem twitter-bootstrap-rails”行移出资产组，并且我确定在上传之前预编译了所有资产到赫罗库。
然而，这并没有解决问题。检查页面后，图标似乎可用，但链接到它们的 CSS 属性被另一个将 background-image 设置为 none 的 CSS 规则覆盖。它似乎发生在作为 twitter bootstrap 一部分的样式表中，所以我不太确定为什么会发生这种情况。
有没有其他人有这个问题？
修复。导致问题的 CSS：
[class^="icon-"], [class*=" icon-"] {
display: inline;
width: auto;
height: auto;
line-height: inherit;
vertical-align: baseline;
background-image: none;
background-position: 0% 0%;
background-repeat: repeat;
是 Fontawesome 的一部分，它默认包含在 twitter-bootstrap-rails 中。问题是 Fontawesome 图标文件没有被预编译，因为它们是不寻常的文件类型。我进入 production.rb 环境文件，并在 config.assets.precompile 列表中添加了“ .woff”、“. eot ”、“.svg”、“. ttf” 。然后我重新编译了我的资产，图标出现了！繁荣。
我通过添加解决了这个问题config/environments/production.rb：
config.assets.precompile += %w( '.woff', '.eot', '.svg', '.ttf' )
我也有下一个字符串Gemfile，没有 github 路径：
gem 'twitter-bootstrap-rails'
使用这种配置，Glyphicons 在 Heroku 上显示得很好。
在 bootstrap.css 文件中进行这些更改：
第 1174 行附近的某处：
- background-image: url("../img/glyphicons-halflings.png");
+ background-image: image-url("glyphicons-halflings.png");
在第 1183 行附近的某个地方：
- background-image: url("../img/glyphicons-halflings-white.png");
+ background-image: image-url("glyphicons-halflings-white.png");
我认为这会奏效。