bootstrap-sass in Rails 4 没有显示正确的字形

Question

我安装了 bootstrap-sass Gem 并尝试使用一些字形图标，但它们没有以正确的方式显示。看起来浏览器正在使用实际字形的替代品，但它没有给我任何错误消息。

对于大多数字形，我只得到这个：  以铅笔为例，我得到这个 ✏。看起来浏览器找不到它们，但据我所知，我的样式表正在正确加载。那么 gem 中是否存在我必须修复的问题？

我的代码如下所示：

application.css.scss

/*
 *= require jquery-ui
 *= require_tree .
 *= require_self
 */

@import "bootstrap-sprockets";
@import 'bootstrap';

application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require bootstrap-sprockets
//= require moment
//= require jquery_nested_form
//= require turbolinks
//= require ckeditor/init
//= require_tree .

index.html.erb

<%= link_to booking_path(booking), :class => 'btn btn-xs', :title => "#{ t('.show', :default => t('helpers.links.show')) }" do %>
    <%= glyph 'info-sign' %>
<%- end -%>

如果您需要更多信息，请告诉我。

编辑 1:

我的代码创建以下 html：

<a class="btn btn-xs" title="Show" href="/houses/1">
  <span class="glyphicon glyphicon-info-sign"></span>
</a>

Answer 1

根据 bootstrap-sass 的文档，您必须 remove *= require_self 和 *= require_tree application.css.scss。

Then, remove all the *= require_self and *= require_tree . statements from the sass file. Instead, use @import to import Sass files.

Do not use *= require in Sass or your other stylesheets will not be able to access the Bootstrap mixins or variables.

所以你可以使用@import

application.css.scss

/*
 *= require jquery-ui
 */

@import "bootstrap-sprockets";
@import 'bootstrap';

Answer 2

在指定 rails-sass.gem 和 bootstrap-sass.gem 的 Gem 版本后，它终于可以工作了。

gem 'bootstrap-sass', '~> 3.3.5.1'
gem 'sass-rails', '~> 5.0.1'

bootstrap-sass in Rails 4 没有显示正确的字形

bootstrap-sass in Rails 4 not showing the proper glyphicons

ruby-on-rails

bootstrap-sass

glyphicons