Rails Admin bootstrap-sass and anjlab-bootstrap-rails - ruby-on-rails

I'm starting to use anjlab-bootstrap-rails gem. I'm also using Rails Admin.
When trying to log into the admin panel I get the following: couldn't find file 'bootstrap'
I added: gem 'bootstrap-sass', '~> 2.3.2.1' in my gem file.
How can I solve this problem. I want to use Bootstrap 3 with anjlab gem, but Rails Admin requires bootstrap-sass.
Thanks

So in the comments above I said just add bootstrap.js to your vendor/javascript directory, this is wrong. This stops Rails Admin from complaining about the bootstrap.js file not being found, however, the bootstrap js files are not included.
The solution I came up with is the following:
Create bootstrap.js in your assets/javascript directory
Add the following to the bootstrap.js file:
//= require twitter/bootstrap
Add the following to your config/application.rb
config.assets.precompile += ['bootstrap.js']
This will add the require bootstrap files for your application, as well as Rails Admin.

Did you add
gem 'anjlab-bootstrap-rails', :require => 'bootstrap-rails',
:github => 'anjlab/bootstrap-rails',
:branch => '3.0.0'
in your gem file as it say here

The rails_admin guys gave a solution for this.
check here
https://github.com/sferik/rails_admin/wiki/Troubleshoot

Related

run rake assets:precompile when switching back and forth between bootstrap gem versions?

Working on a project that started out with Bootstrap 2.3, using the bootstrap-sass gem, specifying version 2.3.1.0 in my gemfile. I'm wanting to update it to Bootstrap 3.
Here's what the app looks like with bootstrap-sass gem version 2.3.1.0:
I checked out a branch to experiment updating the styles to Bootstrap 3, so I updated my gemfile to use the latest version of the bootstrap-sass gem, ran bundle update and install.
I have bootstrap 3 version classes on each of the "Amazing Point" div elements you saw above, so the styles in the hero unit should vanish, the buttons should go flat, and the amazing points should span 4 columns with the "col-lg-4" class I've specified.
But when I launch the rails server, I get a mix of Bootstrap 2.3 and 3:
The "col-lg-4" classes applied to the Amazing Points, BUT the sign in and sign up buttons still look like Bootstrap 2.3 buttons! And there's a subtle, but visible change in the "Sign In" and "Sign Up" text - it's a tad bolder. It's like I've got some weird hybrid of Bootstrap 2.3 and 3 going on.
But now I run rake assets:precompile, and here's what I get:
Now things are displaying correctly.
But why do I always have to run rake assets:precompile to get it working correctly? And how could I make it where it would just update automatically when I switch between the gem files?
Here are the other relevant files:
application.css:
/*
* This is a manifest file that'll be compiled into application.css, which will include all the files
* listed below.
*
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
* or vendor/assets/stylesheets of plugins, if any, can be referenced here using a relative path.
*
* You're free to add application-wide styles to this file and they'll appear at the top of the
* compiled file, but it's generally better to create a new file per style scope.
*
*= require_self
*= require bootstrap
*= require_tree .
*/
Gemfile:
source 'https://rubygems.org'
gem 'rails', '3.2.13'
gem 'jquery-rails'
gem 'devise'
group :production do
gem 'pg'
end
group :development do
gem 'sqlite3'
end
group :assets do
gem 'sass-rails', '~> 3.2.3'
gem 'coffee-rails', '~> 3.2.1'
gem 'uglifier', '>= 1.0.3'
gem 'bootstrap-sass', '3.0.2.0'
end
Gemfile.lock (I'll just show the bootstrap-sass version):
bootstrap-sass (3.0.2.0)
sass (~> 3.2)
application.rb:
require File.expand_path('../boot', __FILE__)
require 'rails/all'
if defined?(Bundler)
# If you precompile assets before deploying to production, use this line
Bundler.require(*Rails.groups(:assets => %w(development test)))
# If you want your assets lazily compiled in production, use this line
# Bundler.require(:default, :assets, Rails.env)
end
module Bloccit
class Application < Rails::Application
config.encoding = "utf-8"
# Configure sensitive parameters which will be filtered from the log file.
config.filter_parameters += [:password]
# Enable escaping HTML in JSON.
config.active_support.escape_html_entities_in_json = true
config.active_record.whitelist_attributes = true
# Enable the asset pipeline
config.assets.enabled = true
# Version of your assets, change this if you want to expire all your assets
config.assets.version = '1.0'
config.assets.initialize_on_precompile = false
end
end
relevant lines in config/development.rb:
# Do not compress assets
config.assets.compress = false
# Expands the lines which load the assets
config.assets.debug = true
config.assets.compile = true
config.serve_static_assets = false
Ok, so I believe I've figured some of this out, after checking out this blog post.
For some reason, if you're updating from the Bootstrap 2.3 bootstrap-sass gem version to the latest one, YOU MUST clean out your old bootstrap-sass gem.
So I ran gem list bootstrap-sass which gave me:
*** LOCAL GEMS ***
bootstrap-sass (3.0.2.0)
bootstrap-sass (2.3.1.0)
Run gem cleanup bootstrap-sass -d and you'll be given a preview of what will happen. Then run gem cleanup bootstrap-sass -v and it will uninstall all previous versions. Restart your rails server and it works.
Then if you were wanting to go back to the old bootstrap-sass version, you would need to update your gemfile, run bundle, and then run gem uninstall bootsrap-sass 3.0.2.0 or whichever later bootstrap-sass gem that you have.
This is kind of a pain, so if someone knows a better way of going about this, please share. I might see if the bootstrap-sass-rails gem offers a better experience.

Unable to load twitter-bootstrap-rails from a rails mountable engine

I have converted am existing rails 3.2 application to a mountable engine, but the asset pipeline is broken with the following error:
'twitter/bootstrap/bootstrap.less' wasn't found
(in /Users/developer/Projects/messaging_app/app/assets/stylesheets/messaging_phase1/bootstrap_and_overrides.css.less)
And it fails while executing the following line in bootstrap_and_overrides.css.less
#import "twitter/bootstrap/bootstrap.less";
I have verified that the twitter-bootstrap gem is installed and is loaded.
It seems that the bootstrap.less file from the gem is not loaded by the application after the application is converted to an engine.
After adding the following lines to engine.rb, it worked.
require 'less-rails'
require 'less/rails/bootstrap'
myengine.gemspec has the following lines:
s.add_dependency 'less-rails-bootstrap'
s.add_development_dependency "therubyracer"
My app & engine specs:
Rails 4.2,
Ruby 2
less & less-rails 2.6.0
You need this in application.css (see here):
*= require bootstrap_and_overrides
but you may also try, if it is enough to just use:
*= require_tree .
And if you are using Rails 4 (which apparently you do not) you should not include the bootstrap gems in an :assets group in your gemfile (see here). This was answered here before.

zurb-foundation gem not added to asset path in existing Rails 3.2 application

I have an existing Rails 3.2.14 application that I am trying to add zurb-foundation to. I have added the zurb-foundation gem and run the installation generator.
My problem is that, whenever I try to load a page, I get this error:
couldn't find file 'foundation'
when Sprockets hits the
//= require foundation
line in application.js
The problem appears to be that the directory with the assets from the zurb-foundation gem are not being added to the load path. In contrast, I have an application that I generated more recently, including zurb-foundation from the beginning, and #asset_paths.asset_environment.paths includes the following
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-rails-3.0.4/vendor/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/coffee-rails-3.2.2/lib/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/zurb-foundation-4.3.0/scss",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/zurb-foundation-4.3.0/js"
which are not included in the asset load path in the app I am updating. Instead, I am getting (with p #asset_paths.asset_environment.paths in the better_errors diagnostic window)
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/images",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/stylesheets",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-rails-3.0.4/vendor/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/coffee-rails-3.2.2/lib/assets/javascripts"
interestingly, if I run the console in development mode and look at Rails.application.config.assets.path, it includes:
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/images",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-ui-rails-4.0.4/app/assets/stylesheets",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/jquery-rails-3.0.4/vendor/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/coffee-rails-3.2.2/lib/assets/javascripts",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/zurb-foundation-4.3.1/scss",
"/usr/local/var/rbenv/versions/1.9.3-p327/lib/ruby/gems/1.9.1/gems/zurb-foundation-4.3.1/js"
and that DOES include the zurb-foundation asset paths.
I have included gem 'zurb-foundation' in the assets group, in the development group, and outside any group. I am using zurb-foundation-4.3.1 in the new app.
My Gemfile assets group is:
group :assets do
gem 'sass-rails'
gem 'coffee-rails'
gem 'uglifier'
gem 'compass-rails'
gem 'zurb-foundation'
end
This problem seems similar to Sprockets::FileNotFound with ZURB Foundation, although Jurriaan did not mention the asset load path.
Any idea what I could be missing?
Thanks!
Have you tried restarting the webserver?
Update:
You said it runs fine in development, Have you tried to rake assets:clean and rake assets:precompile?
It was a problem with a gem that was preventing foundation's entries being added to the load_path. The gem involved was mongomapper-versioned.
By not loading that gem, the problem resolved. By adding the gem back, the problem recurs.
That gem has not had any activity for two years. I guess it's time to find something else.

Installing Bootstrap 3 on Rails App

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!

Rails 3.1 asset pipeline not working

I am in the process of upgrading an old app to the asset pipline but after following the ryan bates tutorial on upgrading to 3.1 I am still not able to take advantage of the pipline. In order to rule out my upgrade process I created a fresh rails app and attempted some coffee scripting and adding other files to the /assets/javascripts folder, however any additional files besides the application.js do not seem to be rendered.
This is my application.js file:
// This is a manifest file that'll be compiled into including all the files listed below.
// Add new JavaScript/Coffee code in separate files in this directory and they'll automatically
// be included in the compiled file accessible from http://example.com/assets/application.js
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// the compiled file.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
alert("this displays fine");
And the additional dogs.js.coffee file:
# Place all the behaviors and hooks related to the matching controller here.
# All this logic will automatically be available in application.js.
# You can use CoffeeScript in this file: http://jashkenas.github.com/coffee-script/
alert "cant see this!"
It seems to be a sprockets issue but I really cant find anyone with the same problem, or info on when additional javascript files within the assets folder are not included in the application.js via the require_tree .
Here is my gem file:
gem 'rails', '3.1.1'
gem 'sqlite3'
group :assets do
gem 'sass-rails', '~> 3.1.4'
gem 'coffee-rails', '~> 3.1.1'
gem 'uglifier', '>= 1.0.3'
end
gem 'jquery-rails'
group :test do
# Pretty printed test output
gem 'turn', :require => false
end
my ruby version is 2.0.0p195
thanks for any help!
G
It seems the ruby version was my problem, I downgraded to ruby 1.9.3, then reinstalled gems and it works now!

Resources