Undefined variable: "$alert-padding" using Rails, AngularJS and Bootstrap - ruby-on-rails

I am experiencing an issue while precompiling the assets of my Rails projects.
Here is the versions of some of the gems I am using:
rails (4.2.0)
bootstrap-sass (3.3.3)
sass-rails (5.0.1)
The project is an AngularJS project sourcing the following gems from Rails Asset:
rails-assets-bootstrap-additions (0.2.3)
rails-assets-angular-bootstrap (0.11.2)
rails-assets-bootstrap-sass-official (3.3.3)
Following the README on the bootstrap-sass Github page, I renamed my app/assets/stylesheets/application.css file to application.scss and replaced its content by:
#import "bootstrap-sprockets";
#import "bootstrap";
Here is the error I get when I launch RAILS_ENV=production rake assets:precompile --trace:
** Execute assets:precompile
rake aborted!
Sass::SyntaxError: Undefined variable: "$alert-padding".
(in /home/owner/.rvm/gems/ruby-2.1.5/gems/bootstrap-sass-3.3.3/assets/stylesheets/bootstrap/_alerts.scss:10)
I looked into ClothSword's answer to this similar post, but in my case puts config.assets.precompile.inspect outputs (lambda)>, /(?:\/|\\|\A)application\.(css|js)$/], which I believe to be the default.
Would anyone have more insight on this? You can browse the source here

It looks like the problem I'm facing is that one of the gem I'm using, sprangular, is setting this precompile rule:
Rails.application.config.assets.precompile += %w( bootstrap/* )
If I comment out this rule and source my own modified version of the gem in the Gemfile, rake assets:precompile now works.
I'm not entirely sure the reason why they set a rule to precompile all of the boostrap files. Does that make sense?
I've created an issue in their Github repo to gain clarity on whether this is a bug or just me not configuring the asset pipeline properly in my app.
I will update this answer as I get clarity from the discussion over there. Feel free to make suggestions here too.

Related

Sprockets::FileNotFound: couldn't find file '../../fonts/bootstrap/glyphicons-halflings-regular.eot'

Tonight I got a strange new error when trying to push to Heroku. Normally pushing to Heroku works fine, but for some reason tonight apparently a glyphicon is missing from bootstrap-sass project and Heroku thus fails to accept a push. Here's the error Heroku gives upon git push heroku master:
Running: rake assets:precompile
I, [2014-06-17T02:59:50.058577 #768] INFO -- : Writing /tmp/build_f0c4c8f6-f9ab-40b7-9346-9eb892ea1990/public/assets/karen-1-1a16815583cabbc3e2b1afa7877ecb2f.png
I, [2014-06-17T02:59:50.063553 #768] INFO -- : Writing /tmp/build_f0c4c8f6-f9ab-40b7-9346-9eb892ea1990/public/assets/south-c-1-52ab385056b021aa07ad6ae253eb6054.png
I, [2014-06-17T02:59:59.186515 #768] INFO -- : Writing /tmp/build_f0c4c8f6-f9ab-40b7-9346-9eb892ea1990/public/assets/application-91b0b1a3925fb425e8b51c103f7009af.js
rake aborted!
Sprockets::FileNotFound: couldn't find file '../../fonts/bootstrap/glyphicons-halflings-regular.eot'
(in /tmp/build_f0c4c8f6-f9ab-40b7-9346-9eb892ea1990/app/assets/stylesheets/application.css.scss:1)
I have all assets to precompile, in config/application.rb I have config.serve_static_assets = true.
In app/assets/stylesheets/application.css.scss I'm making sure to import bootstrap: #import "bootstrap";
My gem file:
gem 'bootstrap-sass', github: 'twbs/bootstrap-sass'
gem 'bootstrap-sass-extras'
Is this an issue with the bootstrap-sass gem, as I see someone else recently had the same issue with no solution: https://github.com/twbs/bootstrap-sass/issues/592
A temporary solution that at least lets me push to Heroku successfully and have my assets precompiled is to remove github: 'twbs/bootstrap-sass' from the Gemfile where bootstrap-sass is imported and just have the line gem 'bootstrap-sass'. Hopefully this bug will be fixed soon at the Github project.
Edit 5 months later: this bug was fixed a few nights after this question was asked.

Failed to deploy Rails app with gem bootstrap-sass 3.0.3.0 on heroku

I have a rails application that I wanted to upgrade from bootstrap-sass 2 to bootstrap-sass 3
After modifying some css class name, my application worked perfectly on my machine.
I removed the #import bootstrap-responsive ( because bootstrap is natively responsive since 3.0 ) I updated my gemfile and my bundle BUT when I try to deploy my application on Heroku I have the following error :
AssetSync: using /tmp/build_68121564-cc6f-46c8-86d7-ad9ccb180ea1/config/initializers/asset_sync.rb
rake aborted!
File to import not found or unreadable: bootstrap-responsive.
Load paths:
Sass::Rails::Importer(/tmp/build_68121564-cc6f-46c8-86d7-ad9ccb180ea1/app/assets/stylesheets/developers.css.sass)
What I tried so far :
Remove gem bootstap-sass from the asset group (didn't work )
I tried the rake tmp:clear command (didn't work either )
Bundle updated and bundle installed everything again ( still not working )
What should I do ?
The problem is clearly due to some temp files but even after cleaning them I can't push my app on heroku.
Solved
I just had a #import bootstrap-responsive in another .css.scss file im my repo.

Rails 3.2 asset compilation issues on Heroku

It seems a lot of people are having similar problems. I consulted this thread, this, and this article, among others. I have found a lot of topics concerning these issues, but the posted solutions have been unable to find a definitive fix. I am currently running rails 3.2.8 with ruby 1.9.2, and Heroku stack cedar.
I am having two major, related issues:
1) My projects are pushing some assets - not all - to heroku.
Per suggestions in other threads, when I place:
config.assets.initialize_on_precompile = false
in my /config/application.rb,
config.serve_static_assets = true
config.assets.precompile += %w( *.js )
in /config/environments/production.rb, and
gem 'rails_12factor', group: :production
in my gemfile, the push will precompile successfully, however the application.js file is empty on Heroku:
2) Precompiling before a push successfully puts JS on Heroku, but it is no longer recognized.
After removing
config.assets.precompile += %w( *.js )
from /config/production.rb, and running
RAILS_ENV=production bundle exec rake assets:precompile
committing and pushing results with index.html.erb not recognizing JS despite application.js present & non-empty as shown below:
I feel as if I have tried all combinations of these solutions to no avail. I have not yet updated the applications to Rails 4, is this a good idea to do at this time?
Any other suggestions where to go from here?
Oddly, in another Rails 3.2 app of mine, I get a similar error only the first time I visit
Once the page loads, simply hitting refresh loads all content and the errors go away. This app has none of the attempted solutions above in its codebase.
I had the same problem, what solved it for me was specifying my ruby version in the gemfile.
ruby '1.9.3'
No answer, but this may help. I precompile using the options below, which means only MD5 versions are created, this helped me fix a few issues.
rake -v --trace assets:precompile:primary RAILS_ENV=production
I also always do this before a precompile:
rake assets:clean
Also, double-check the exact MD5'd name, both in the html and the name of the file in heroku.
Same happened to me. When I updated the Rails version from 3.2.8 to 3.2.11 it Worked!

javascript asset not being found in gem

This should have been a no-brainer, but has me stumped.
For convenience, I took a bootstrap plugin (bootstrap-combobox) and turned it into a gem, so I can version it properly and all.
My gem is bootstrap-combobox-rails.
It packages up fine, bundle installs fine, but when I try to reference the assets: The stylesheet works, although I have to do it like this in my application.css.scss:
#import "bootstrap-combobox.css";
(everything else is fine without the .css).
The javascript is not found, though. No matter if I reference it as
//= require bootstrap-combobox.js
or
//= require bootstrap-combobox
I get:
$ rake assets:precompile
/Users/denishaskin/.rvm/rubies/ruby-1.9.3-p374/bin/ruby /Users/denishaskin/.rvm/gems/ruby-1.9.3-p374#oneclick/bin/rake assets:precompile:all RAILS_ENV=production RAILS_GROUPS=assets
rake aborted!
couldn't find file 'bootstrap-combobox.js'
(in /Users/denishaskin/clients/cs/1-click/oneclick/app/assets/javascripts/application.js:18)
Suggestions? Thanks...
Resolved this.
It was one or both of these things, I don't recall exactly which did it. Both are described here.
Making the gem into a Rails::Engine
Adding the dependency on railties into the gemspec

Rails 3.1 Compass and Sprockets. Confused

I am generally confused about Rails 3.2, Sprockets, and Compass.
At the top of this article, it says *= require directives, are no longer needed using Sass-Rails, just use #import instead. The Sass-Rails Github talks about a little about glob #import feature, but doesn't talk at all about #import being the new *= require. Which one or combo :(
do I use?
Having coderay.css.sass in vendor/assets/stylesheets and using #import in application.css.sass will import my_coderay.css.sass?
I don't know because I'm using Compass Mixins in my_coderay.css.sass (thus putting a #import "compass/css3" at the top of that file) and I'm getting an error:
"File to import not found or unreadable: compass"
In this article it talks about configuring Rail's Sass engine to know about the assets path. But I thought Sass-Rails already teaches #import where asset path is?
Also when I try to include the 31 branch of compass...
gem 'compass', :git => 'git://github.com/chriseppstein/compass.git', :branch => 'rails31'
I get errors...
Using compass (0.12.0.alpha.0.22e2458) from git://github.com/chriseppstein/compass.git (at rails31) /Users/george.norris/.rvm/rubies/ruby-1.9.2-p180/lib/ruby/site_ruby/1.9.1/rubygems/installer.rb:365:in `initialize': No such file or directory - /Users/george.norris/.rvm/gems/ruby-1.9.2-p180/bundler/gems/gems/compass-0.12.0.alpha.0.22e2458/bin/compass (Errno::ENOENT)
And finally, if I take coderay.css.sass out of vendor/assets and put it in app/assets I don't get the above error. But I getting it's spitting out errors in public/application.css.css (.css.css ???)
Syntax error: File to import not found or unreadable: base.
Load paths:
Compass::SpriteImporter
/Users/geonorr/Sites/quasar/public/stylesheets/sass
/Users/geonorr/Sites/quasar/app/assets/stylesheets
/Users/geonorr/.rvm/gems/ruby-1.9.2-p180/gems/compass-0.11.5/frameworks/blueprint/stylesheets
/Users/geonorr/.rvm/gems/ruby-1.9.2-p180/gems/compass-0.11.5/frameworks/compass/stylesheets
on line 3 of /Users/geonorr/Sites/quasar/app/
I am using Rails (3.1.0), Sass (3.1.7), Sass-Rails (3.1.0), Compass (0.11.5)
Thanks for the response. Feel like I am getting closer...
Including Compass Master Branch and getting this error:
gem 'compass', :git => 'git://github.com/chriseppstein/compass', :branch => 'master'
Using compass (0.12.alpha.0.d03d529) from git://github.com/chriseppstein/compass (at master) /Users/gnee/.rvm/rubies/ruby-1.9.2-p180/lib/ruby/site_ruby/1.9.1/rubygems/installer.rb:365:in initialize': No such file or directory - /Users/gnee/.rvm/gems/ruby-1.9.2-p180/bundler/gems/gems/compass-0.12.alpha.0.d03d529/bin/compass (Errno::ENOENT)
from /Users/gnee/.rvm/rubies/ruby-1.9.2-p180/lib/ruby/site_ruby/1.9.1/rubygems/installer.rb:365:inopen'
from /Users/gnee/.rvm/rubies/ruby-1.9.2-p180/lib/ruby/site_ruby/1.9.1/rubygems/installer.rb:365:in shebang'
from /Users/gnee/.rvm/rubies/ruby-1.9.2-p180/lib/ruby/site_ruby/1.9.1/rubygems/installer.rb:456:inapp_script_text'
*= require comments can be seen as a hacky workaround from the perspective of Sass, because Sass has a dedicated language feature for that: the #import directive. #import tells Sprockets what to do. When you are migrating from a Rails 3.0 project, leave all #import statements as they are. At the moment, the only gotcha is "globbing": How to tell Rails/Sprockets to regard also other Sass files than application.css.s(ac)ss.
Here is the latest Compass installation guide for Rails 3.1. It also tackles the globbing problem.
As it is said in the Rails Guide, app/assets, lib/assets or vendor/assets directories in your app as well as in your gems/engines are included in Rails.application.config.assets.paths. I verified that +opacity(.5) from the compass/css3 library works as expected if you install compass properly. Which leads us to the next point:
The rails31 branch is merged into master now and version 0.12.alpha has been released that should support Rails 3.1. However, this is version is not yet without bugs. So I recommend to rely on the newest master revision:
gem 'compass', git: 'git://github.com/chriseppstein/compass', branch: 'master'
The only bug I am encountering at the moment is a "undefined method nil.[]" Exception when trying to compile statements that create sprites. See this issue. A workaround for that is to set sass_options = {quite: true} in your config/compass.rb
Further note: I do not have Sass in my Gemfile any more. I think you can remove that dependency when relying on sass-rails.

Resources