Getting Twitter Bootstrap to work with Rails 3.1 Asset Pipeline

While converting my app from rails 3.0 to 3.1 I had an issue getting bootstrap working with the asset pipe line after digging a while here is what I had to do.

 

In application.css

/**

= require ./bootstrap/bootstrap*

= require_tree ./smoothness*=

require_self
*/

Rename bootstrap.less to bootstrap.css.less.erb

In bootstrap.css.less.erb  remove what is there and put in

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/reset.css.less" %>

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/preboot.css.less" %>

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/scaffolding.css.less" %>
<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/type.css.less" %>

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/forms.css.less" %>

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/tables.css.less" %>

<%= File.read "#{Rails.root}/app/assets/stylesheets/bootstrap/patterns.css.less" %>

 

Next rename all bootstrap files to *.css.less

 

Then in my GemFile

 

group :assets do 

gem 'sass-rails', "  ~> 3.1.0" 

gem 'coffee-rails', "~> 3.1.0" 

gem 'less' 

gem 'uglifier'

end

 

 

That was it.

 

Comments

[Sebastian]

Hi,
which version of bootstrap are you using?
I tried v1.3.0, converted bootstrap.css.less.erb file and added the less gem but it doesnt work.
The bootstrap.css contains only the reset.css.less file, the second one that should be included is variables, but only first two lines are included (comments). http://pastie.org/2567441

[Cid Dennis]

I am also using 1.3.0. The bootstrap.less in 1.3 has more than just the rest. Do not use the bootstrap.css that is the version that does not require less. You want the .less version.