I have trouble with uploading glyphicons in production in my rails 4 app.
Solutions like this so question not working for me.
My application.css.scss file contain this lines:
#import "bootstrap-sprockets";
#import "bootstrap";
$icon-font-path: "bootstrap/";
It's right path on production to glyphicons fonts in application.css file, for example:
url("/assets/bootstrap/glyphicons-halflings-regular-8cd45fc682c0e3a2695ce9453750efec.woff2") format("woff2")
I try to download this file(mydomain.com/assets/bootstrap/glyphicons-halflings-regular-8cd45fc682c0e3a2695ce9453750efec.woff2) and I've downloaded it, that mean that files stores in servers in the right directory. And in my browser I don't see 404 errors.
But I noticed one thing, that confused me, locally I can see that glyphicons fonts downloaded:
And in production I don't see that file in network tab:
And there are no js errors
Why glyphicons doesn't load in production mode in rails?
I've downgraded bootstrap-sass gem from 3.3.5 to 3.3.0.1 and glyphicons work as expected.
Updated: update gem 'sass-rails', '>= 5.0.0' correspond with this issue and now glypicons works as expected with version of bootstrap-sass gem 3.3.5
Related
I am trying to import/activate bootstrap in my Ruby on Rails application. I have added the#import "bootstrap-sprockets"; followed by
#import "bootstrap"; lines to my application.css.scss file and saved it. I also added gem 'bootstrap-sass', '3.3.1' to my Gemfile. I then restarted my server. When I launch the app from my browser, it doesn't appear that the bootstrap sass/css was applied. I can tell because the font never changed and the bootstrap navbar I added don't look correct. I have tried closing out my browser and starting over and trying to launch the link from a different browser, but it doesn't help. Any suggestions?
Inside your gem file:
gem 'bootstrap-sass'
Inside your console
bundle install
app > assets > stylesheets > application.css
#import "bootstrap-sprockets";
#import "bootstrap";
Finally, rename the file from application.css to application.css.scss and restart your server. (Don't forget to add the JavaScript too.)
Simply add bootstrap .css files in assets and same goes for .js files. It should work then without installing gems. It is the best option as you can update your files with new versions whenever you want.
I was just fiddling around with some things and happened to run bundle install on my ruby on rails app. I noticed that bootstrap updated from 3.1.1 to 3.2.0 and now when I go to generate certain views, I get this error:
ActionController::RoutingError (No route matches [GET] "/fonts/bootstrap/glyphicons-halflings-regular.ttf"):
Didn't happen until this gem update. Any suggestions? I've tried explicitly using 3.1.1 in the Gemfile and running bundle again, but this doesn't help. It looks just like a simple routing issue, but idk why this would have only changed during the gem update.
My problem was with the order I was importing bootstrap in my application.css.scss file. Make sure the order goes:
#import "bootstrap-sprockets";
#import "bootstrap";
For anyone who else can't get an answer on this, I manually changed this file:
/home//.rvm/gems/ruby-2.1.1/gems/bootstrap-sass-3.2.0.2/assets/stylesheets/bootstrap/_glyphicons.scss and took out the $icon_path or whatever it was and replaced it with "../assets/bootstrap/
Fixed the problem thereafter.
I had the same problem like you. After some research these are the most important things i found out:
1) Since bootstrap-sass version 3.2.0 the asset directory moved from vendor/assets to assets/
source: Issue with upgrade to bootstrap-sass 3.2.0
2) The font files from customizer are probably corrupted and should be downloaded directly from the Bootstrap homepage.
source: Bootstrap 3 Glyphicons not working
As you already said; change the version back to 3.1.1.1 should do the trick. I uninstalled the gem via:
gem uninstall bootstrap-sass
Then I changed the version defined in the gemfile and reinstalled it with
gem install bootstrap-sass
bundle update
This might help people facing the same issue.
I'm trying to use the bootstrap_form ~> 2.0.1 gem (see https://github.com/bootstrap-ruby/rails-bootstrap-forms) but it's giving me fits. I've installed is as per the instructions on their github page, adding it to my Gemfile:
gem 'bootstrap_form', '~> 2.0.1'
I ran bundle install. I then added it to my application.css.scss file:
*= require_self
*= require rails_bootstrap_forms
*= require_tree .
But, when I try to run my app I get:
couldn't find file 'rails_bootstrap_forms' (in /path/to/my/app/assets/stylesheets/application.css.scss:12)
I'm obviously missing something. I checked lib/assets/ and vendor/assets/stylesheets/ but there's nothing there. Likewise, there's nothing in app/assets/stylesheets/.
What the fudge?
I had some trouble with this, partly (I think) because they renamed the gem. What seemed to make the difference for me was to have bundle grab the latest gem from github, by putting this into my Gemfile:
gem 'bootstrap_form', github: 'bootstrap-ruby/rails-bootstrap-forms'
I use bootstrap-sass, so I didn't want to mess around with application.css, so I made sure the following import statements were in application.css.scss, like this:
#import "bootstrap";
#import 'rails_bootstrap_forms';
It's also quite important to remember to restart the server after making these changes!
You have got to create the file rails_bootstrap_form.css in app/assets/stylesheets
.rails-bootstrap-forms-date-select,
.rails-bootstrap-forms-time-select,
.rails-bootstrap-forms-datetime-select {
select {
display: inline-block;
width: auto;
}
}
.rails-bootstrap-forms-error-summary {
margin-top: 10px;
}
I had this problem and found that I'd mistyped the Gemfile entry as bootstrap-form. I corrected it to bootstrap_form and all was well.
Have you installed Bootstrap? Looks like that is a requirement of bootstrap_form, but it's not included as a dependency in the gem which means you need to manually install Bootstrap.
One popular way to do this is with the twitter-bootstrap-rails gem. The simplest way to install this is to include gem "twitter-bootstrap-rails" in your gemfile, and then run
$ bundle install
followed by
rails generate bootstrap:install static which should add the required CSS files to your assets folder.
I was getting the same error so I took out *= require rails_bootstrap_forms from application.css.scss and was able to compile and deploy without any errors.
Despite SO's admonishment not to respond to other answers I'm going to enhance Thomas Geider's answer above by explaining why you need to create a rails_bootstrap_forms.css file in app/assets/stylesheets.
If you look in the rails-bootstrap-forms Github you'll notice they have a rails_bootstrap_forms.css file. The README doesn't tell you this but it follows that this css file needs to be in /app/assets/stylesheets.
Here's the file:
https://github.com/bootstrap-ruby/rails-bootstrap-forms/blob/master/app/assets/stylesheets/rails_bootstrap_forms.css
Is twitter-bootstrap-rails compatible with rails 4 and ruby 2.0. I was having tons of trouble installing this on my rails app after going through two railscast and the readme on its github page. Sorry I couldn't find a straight forward answer both in the repo's issues and from googling online.
on the repo page it says
Twitter Bootstrap for Rails 3.1 Asset Pipeline
To get bootstrap in Rail 4.
Add gem 'bootstrap-sass' to your Gemfile.
and then add #import "bootstrap-sprockets";
and #import "bootstrap";
to the top of your application.scss file. Don't forget to run bundle install.
I'm trying to install Bootstrap 3.0 on my Rails app. I recently finished Michael Hartl's tutorial and am now trying to build my own system using this new version of Bootstrap, but I have a few questions that I'm not sure about.
My system specs:
OS X Mountain Lion on MBP
Rails 4.0
Ruby 2.0
Questions I have:
What is the best gem to use in my Gemfile? I have found a few of them.
What do I import on my custom.css.scss? I read somewhere that it's different from 2.3.2.
Is there anything else I have to do to get Bootstrap to work, or are the remaining steps identical to the ones I followed for Bootstrap 2.3.2?
Edit
Here is what the bootstrap-rails project on GitHub first says to do:
gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails',
:github => 'anjlab/bootstrap-rails'
Then it says to do:
gem 'anjlab-bootstrap-rails', '>= 3.0.0.0', :require => 'bootstrap-rails'
Do they do the same thing, or do you have to do them both?
Actually you don't need gem for this, here is the step to install Bootstrap 3 in RoR
Download Bootstrap
Copy:
bootstrap-dist/css/bootstrap.css and bootstrap-dist/css/bootstrap.min.css
To: vendor/assets/stylesheets
Copy:
bootstrap-dist/js/bootstrap.js and bootstrap-dist/js/bootstrap.min.js
To: vendor/assets/javascripts
Update: app/assets/stylesheets/application.css by adding:
*= require bootstrap.min
Update: app/assets/javascripts/application.jsby adding:
//= require bootstrap.min
With this you can update bootstrap any time you want, don't need to wait gem to be updated. Also with this approach assets pipeline will use minified versions in production.
As many know, there is no need for a gem.
Steps to take:
Download Bootstrap
Direct download link Bootstrap 3.1.1
Or got to http://getbootstrap.com/
Copy
bootstrap/dist/css/bootstrap.css
bootstrap/dist/css/bootstrap.min.css
to: app/assets/stylesheets
Copy
bootstrap/dist/js/bootstrap.js
bootstrap/dist/js/bootstrap.min.js
to: app/assets/javascripts
Append to: app/assets/stylesheets/application.css
*= require bootstrap
Append to: app/assets/javascripts/application.js
//= require bootstrap
That is all. You are ready to add a new cool Bootstrap template.
Why app/ instead of vendor/?
It is important to add the files to app/assets, so in the future you'll be able to overwrite Bootstrap styles.
If later you want to add a custom.css.scss file with custom styles. You'll have something similar to this in application.css:
*= require bootstrap
*= require custom
If you placed the bootstrap files in app/assets, everything works as expected. But, if you placed them in vendor/assets, the Bootstrap files will be loaded last. Like this:
<link href="/assets/custom.css?body=1" media="screen" rel="stylesheet">
<link href="/assets/bootstrap.css?body=1" media="screen" rel="stylesheet">
So, some of your customizations won't be used as the Bootstrap styles will override them.
Reason behind this
Rails will search for assets in many locations; to get a list of this locations you can do this:
$ rails console
> Rails.application.config.assets.paths
In the output you'll see that app/assets takes precedence, thus loading it first.
This answer is for those of you looking to Install Bootstrap 3 in your Rails app without using a gem. There are two simple ways to do this that take less than 10 minutes. Pick the one that suites your needs best. Glyphicons and Javascript work and I've tested them with the latest beta of Rails 4.1.0 as well.
Using Bootstrap 3 with Rails 4 - The Bootstrap 3 files are copied into the vendor directory of your application.
Adding Bootstrap from a CDN to your Rails application - The Bootstrap 3 files are served from the Bootstrap CDN.
Number 2 above is the most flexible. All you need to do is change the version number that is stored in a layout helper. So you can run the Bootstrap version of your choice, whether that is 3.0.0, 3.0.3 or even older Bootstrap 2 releases.
Twitter now has a sass-ready version of bootstrap with gem included, so it is easier than ever to add it to Rails.
Simply add to your gemfile the following:
gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2
gem 'bootstrap-sass', '~> 3.1.1'
bundle install and restart your server to make the files available through the pipeline.
There is also support for compass and sass-only: https://github.com/twbs/bootstrap-sass
I use https://github.com/yabawock/bootstrap-sass-rails
Which is pretty much straight forward install, fast gem updates and followups and quick fixes in case is needed.
gem bootstrap-sass
bootstrap-sass is easy to drop into Rails with the asset pipeline.
In your Gemfile you need to add the bootstrap-sass gem, and ensure that the sass-rails gem is present - it is added to new Rails applications by default.
gem 'sass-rails', '>= 3.2' # sass-rails needs to be higher than 3.2
gem 'bootstrap-sass', '~> 3.0.3.0'
bundle install and restart your server to make the files available through the pipeline.
Source: http://rubydoc.info/gems/bootstrap-sass/3.0.3.0/frames
For me, the simplest way to do this is
1) Download and unzip bootstrap into vendor
2) Add the bootstrap path to your config
config.assets.paths << Rails.root.join("vendor/bootstrap-3.3.6-dist")
3) Require them
in css *= require css/bootstrap
in js //= require js/bootstrap
Done!
This methods makes the fonts load without any other special configuration and doesn't require moving the bootstrap files out of their self-contained directory.
Using this branch will hopefully solve the problem:
gem 'twitter-bootstrap-rails',
git: 'git://github.com/seyhunak/twitter-bootstrap-rails.git',
branch: 'bootstrap3'
I think the most up to date gem for the new bootstrap version is form anjlab.
But I don't know if it currently works good with other gems like simple_form when you do rails generate simple_form:install --bootstrap, etc. you may have to edit some initializers or configurations to fit the new bootstrap version.
I actually had an easy workaround on this one in which I nearly scratch my head on how to make it work. hahah!
Well, first I downloaded Bootstrap (the compiled css and js version).
Then I pasted all the bootstrap css files to the app/assets/stylesheets/.
And then I pasted all the bootstrap js files to the app/assets/javascripts/.
I reloaded the page and wallah! I just added bootstrap in my RoR!