Javascript working locally but not on production

Question

I have been trying to solve this issue for weeks, but with no succes so instead of looking for the answear in other peoples questions, I thought I should write my own.

The problem is as follows. A couple of weeks ago I finished one of my rails projects, so I pushed the repo to heroku. Everything seemed to work fine, but then I notice that my navbar toogle was not working and my carousel neither. Locally ther work perfectly.

Currently it is hosted on heroku.

These are the things I have tried.

1. Assets precompiled and clean
2. Installed gem 'rails_12factor'
3. Reordered app.js as follows

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require twitter/bootstrap
//= require lightbox
//= require_tree .
//= require owl.carousel

4. I even deployed my app to digital ocean(I thought that heroku was the problem)

5. I tried to use a different bootstrap gem. gem 'bootstrap-sass' but still the same issue. So, basically some of the js is not working the way it should. I even tryed to use a different type of slider named flickity, I downloaded the js and css of flickity, precompile, then push but in heroku seems to be broken.

6. Followed the nex stackoverflow questions:

Here is my code:

production.rb

config.serve_static_files = true
config.assets.compile = true

Gemfile

gem "twitter-bootstrap-rails"
gem 'lightbox2-rails'
gem "font-awesome-rails"
gem 'activeadmin'
gem 'owlcarousel-rails'
gem 'rails_12factor', group: :production
gem "rmagick"
gem "carrierwave"
gem "mini_magick"
gem 'kaminari'
gem 'jquery-ui-rails'
gem 'sprockets_better_errors'
group :development do
  gem 'capistrano',         require: false
  gem 'capistrano-rvm',     require: false
  gem 'capistrano-rails',   require: false
  gem 'capistrano-bundler', require: false
  gem 'capistrano3-puma',   require: false
end
gem 'devise'
gem 'cancan'
gem 'draper'
gem 'pundit'
gem 'rails'
gem "puma"
gem 'pg', '~> 0.20.0'
gem 'jquery-rails'
gem 'jbuilder', '~> 2.0'

aplication.css

 *= require lightbox
 *= require font-awesome
 *= require bootstrap
 *= require_tree .
 *= require owl.carousel
 *= require owl.theme

console error

Uncaught TypeError: $(...).carousel is not a function(…)

This error may explain why the carousel does not work. But I have tryed another ones and the they dont work either. And what about the navbar toogle?

There is this one too

Uncaught TypeError: Cannot read property 'bridge' of undefined(…)

If you need any more information let me know please.

Answer 1

Try putting config.assets.debug = true in your production.rb file and see if that fixes it. I'm guessing there is an error in the middle of your compressed JS file causing the rest of the functions to not be executed.