Rails: Bootstrap stopped working after a precompile - ruby-on-rails

For some reason my bootstrap broke after I precompiled my code. This started because I couldn't push to heroku because of a precompile error.
So here are the contents of my application.js file:
//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require dataTables/jquery.dataTables
//= require dataTables/jquery.dataTables.bootstrap3
//= require bootstrap
//= require bootstrap/dropdown
//= require_tree .
Maybe the order is wrong? I just added .../dropdown hoping it would help, but it did not. I just realized I can actually remove both bootstrap lines without affecting my resulting site.
For my gems, I have:
gem 'bootstrap-sass', "~>3.0.3.0"
...
gem 'bootstrap-will_paginate', '0.0.6'
Here is a link to my other question, which is similar but less focused: Ruby on Rails: Ran rake assets:precompile and now both local and heroku deployment don't include bootstrap
Any help would be greatly appreciated. I'm getting pretty frustrated, it's been several days of failed action.

Related

Devise bootstrap views not found after updating to latest version

I get the following error after updating Devise bootstrap views to the latest version (1.1.0). Everything works OK if I switch back to v0.0.11.
What is the problem?
In my Gemfile I have this
gem 'devise'
gem "twitter-bootstrap-rails"
gem "devise-bootstrap-views"
application.css
/*
*= require devise_bootstrap_views
*= require_tree .
*= require_self
*/
bootstrap_and_overrides.css
/*
=require twitter-bootstrap-static/bootstrap
Static version of css will use Glyphicons sprites by default
=require twitter-bootstrap-static/sprites
*/
application.js
//
//= require rails-ujs
//= require jquery
//= require twitter/bootstrap
// require turbolinks
//= require Chart.bundle
//= require chartkick
//= require_tree .
I know this is an old question, but I guess this is a duplicate of Question #52636393.
I had this same problem while updating dependencies from an old project of mine. All I had to do was to remove the following line from application.css
*= require devise_bootstrap_views
Look for this line in your css/sass files and try removing it. Oh, and remember to restart your server :)
I hope it helps.

Why my rails project cannot show Bootstrap styles after changing all these files?

My computer system is Mac OS. In the past few days, I was working on a rails project and I tried to use Bootstrap in my app. Followed by the instruction of Bootstrap website, I changed some files' contents but it still didn't work. Can somebody help me?
This is the code in application.scss:
#import "bootstrap-sprockets";
#import "bootstrap";
This is the code in application.js:
//= require rails-ujs
//= require activestorage
//= require turbolinks
//= require_tree .
This is my Gemfile:
gem 'bootstrap-sass', '3.3.7'
I have also run 'bundle install' on my console. However, nothing happened in my pages.
Your application.js is missing the bootstrap files. Add those and you are good to go. Just add the below
//= require bootstrap-sprockets
to the application.js

Rails 5 - Uncaught Error: Bootstrap dropdown require Popper.js

So, I was struggling at the last few hours about getting my bootstrap navbar to work in my rails 5.1.3 app. No success. I found a console error saying
Uncaught Error: Bootstrap dropdown require Popper.js
I was aware that bootstrap was dropping tether in favour of popper.js. I added it to the Gemfile
gem 'popper_js', '~> 1.11', '>= 1.11.1'
and it did nothing. Added to the application.js like this
//= require popper
and still nothing. After a while, I bumped into Joshua Colvin's answer about popper.js in Angular. After moving the popper line up in the code, like this
//= require popper
//= require turbolinks
//= require bootstrap
And got it to work. I wanted to share this to the community because it is a pretty recent topic and was very hard to find this fix. Hope this helps a lot of coders ;)
Just add require popper before turbolinks and bootstrap like you said in the question
//= require popper
//= require turbolinks
//= require bootstrap

Sprockets cant find asset from rails-assets.org

I try to install react-router and material-ui on my rails 4 app but I get Sprockets::FileNotFound error for react-router and material-ui. I follow instructions from rails-assets.org.
My Gemfile:
source 'https://rails-assets.org' do
gem 'rails-assets-classnames'
gem 'rails-assets-lodash'
gem 'rails-assets-react-router'
gem 'rails-assets-material-ui'
end
application.js
//= require jquery
//= require lodash
//= require jquery_ujs
//= require react
//= require classnames
//= require react_ujs
//= require react-router
//= require turbolinks
//= require_tree .
And after bundle I got this notification on some gems This component doesn't define main assets in bower.json.. Thank you for your time and I hope we work this out.
UPD 1:
I found kind of a solution on stackoverflow but I would like to stick to rails-assets.org way if possible.
ruby '2.2.0'
rails '4.2.3'
Might be easy to forget, but have you restarted your (running) rails server?
Started to use rails-assets yesterday as well and it showed me the exact same problem (Sprockets::FileNotFound).
I restarted the running server in the console and the problem was solved.
Rails 4.2.5
/ Ruby 2.3.

Bootstrap drowdown works locally but not in heroku

Currently working on the Ruby on Rails tutorial (railstutorial.org) and in Chap 8. you make a dropdown menu using bootstrap classes for signed in users.
To make this work the book says to include
//= require jquery
//= require jquery_ujs
//= require bootstrap
in your application.js file.
This does not work locally or on heroku.
However:
//= require bootstrap
//= require jquery
//= require jquery_ujs
works locally, not on heroku. This also creates a ton of error messages in the console (Uncaught TypeError: cannot read property 'fn' of undefined)
Every stack thread and googled page I go to says that bootstrap goes first in local and jquery first in production. Meanwile I'm pulling my hair out.
git hub: https://github.com/nelsonkhan/sample_app
heroku: https://guarded-shelf-3017.herokuapp.com/
you need to have all 4 of these:
//= require jquery
//= require jquery_ujs
//= require bootstrap
//= require_tree .
Make sure your assets are properly compiled when you deploy on heroku. Check here for more details: https://devcenter.heroku.com/articles/rails-asset-pipeline
Changing production.rb helped for me
config.assets.compile = true

Resources