Glyphicon在本地工作但不在Heroku上工作

如果你在这里查看我的应用程序: http : //quiet-brushlands-5712.herokuapp.com/ ,靠近按钮的是一个图标,一个glyphicon。 但它没有出现在heroku上。 在本地它显示如下:

在此处输入图像描述

我从这里尝试了“解决方案” 在Rails production / heroku w / o LESS或SASS以及谷歌的其他链接中使用boostrap.css文件 。 我也需要在Heroku上显示字形。 有帮助吗?

我没有手动下载Twitter Bootstrap,我只是使用了一个gem。 在我的Javascript控制台中,我有这个:

GET http://quiet-brushlands-5712.herokuapp.com/assets/glyphicons-halflings.png 404 (Not Found)

我的Gemfile如果有帮助:

 source 'https://rubygems.org' gem 'rails', '4.0.2' gem 'sass-rails', '~> 4.0.0' gem 'uglifier', '>= 1.3.0' gem 'coffee-rails', '~> 4.0.0' gem 'jquery-rails', '3.0.4' gem 'turbolinks', '2.0.0' gem 'jbuilder', '~> 1.2' gem 'bootstrap-sass', '2.1' gem 'jquery-ui-rails', '4.1.0' gem 'pg' gem 'font-awesome-rails', '4.0.3.0' group :doc do # bundle exec rake doc:rails generates the API under doc/api. gem 'sdoc', require: false end group :development, :test do gem 'rspec-rails', '2.11.0' gem 'guard-rspec', '1.2.1' gem 'guard-spork', '1.2.0' gem 'childprocess', '0.3.6' gem 'spork', '0.9.2' end group :production do gem 'rails_12factor' end 

解决方案是在config/environments/production.rb文件中将config.assets.compile = false更改为config.assets.compile = true

不使用编译回退的解决方案(在Rails 4.1上测试):在scss文件中,在bootstrap之前导入bootstrap-sprockets。

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

继Vidya的评论之后,这可能是你的资产管道问题

虽然我对此不熟悉Bootstrap的细节,但Heroku的资产管道存在一个主要问题,即必须先进行预编译才能有效地使用它


资产指纹识别

由于资产指纹识别, Heroku要求您预编译资产

这是您的资产将在其文件名末尾应用哈希的位置,如image-12sdafdsafkj223423jnjfadsnfsad.png或类似名称。 这样做的原因显然是为了保持资产的独特性

如果您按照Vidya提供的链接 ,您会发现Heroku会提示您使用Rails CMD预编译您的资产。 它没有告诉你的是,除非动态分配,否则这会弄乱你的图像


SCSS

如上所述,我不确定具体如何适用于Bootstrap,但使用Heroku的资产管道,您需要确保使用动态路径分配图像

与Rails本身一样,SCSS允许您使用asset_pathimage_path来创建动态链接。 这是您必须要解决的问题。 这是我们使用的一些代码,适用于Heroku:

 .navigation_bar { z-index: 200; position: relative; background: asset_url('nav_bar/bg.png') repeat-x top; } 

如果您不想在生产环境中将config.assets.compile设置为true(您可能不应该为了更好的性能),则可以在使用rake assets:precompile RAILS_ENV=production推送到heroku之前手动预编译rake assets:precompile RAILS_ENV=production

config/environments/production.rb

config.assets.compile = false更改为config.assets.compile = true

(然后不要忘记提交并推送到heroku)

为我工作……

因为我在搜索时得到了这个答案,我想我应该在这里说我遇到的解决方案是在bootstrap之前包含一个导入到“bootstrap-sprockets”。 这在https://github.com/twbs/bootstrap-sass/issues/653中有记录。

我意识到问题不是使用bootstrap-sass 3.2+,但我认为这可能有助于某人。