Javascript features work on localhost but not when deployed to Heroku

Question

I've noticed that when I deploy to Heroku, javascript features dont work (such as Bootstrap Popover, Buttons, etc). I'm working with rails 3.2.2, ruby 1.9.3. The features work on localhost. There appear to be no errors displayed when deployed to Heroku (the features simply don't show up).

Any ideas? Thanks!

If you put some console.log lines in, do you get anything out? — jimw
– jimw, Commented Apr 18, 2012 at 18:14
I don't know anything about Heroku (first time I've ever heard the name before), but JavaScript is executed on the client-side. So as long as you are using the same browser and the JavaScript code is the same, you should get the same behavior. Try viewing the source code (from the right-click menu or Edit menu in your browser) for both scenarios and compare for differences. — Travesty3
– Travesty3, Commented Apr 18, 2012 at 18:17
Are the Javascript files being pulled correctly (what does Firebug say)? If so, do you have any code specific to localhost domain? — Igor
– Igor, Commented Apr 18, 2012 at 18:17
jimw: I tested console.log and I get an output in localhost, but nothing when its deployed to heroku. — Alex De Simone
– Alex De Simone, Commented Apr 18, 2012 at 19:42
Using Chrome, and the error I see in the inspector says: "Uncaught TypeError: Object [object Object] has no method 'popover' — Alex De Simone
– Alex De Simone, Commented Apr 18, 2012 at 19:44

Dru · Accepted Answer · 2013-01-05 20:54:02Z

15

Manually precompiling worked for me.

bundle exec rake assets:precompile before you push to heroku.

answered Jan 5, 2013 at 20:54

Dru

9,88014 gold badges52 silver badges68 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

eziegl Over a year ago

This seems to be the way to go if you manually include bootstrap.js and bootstrap.css instead of using the gem

Kick Buttowski Over a year ago

heroku does that for ya

Community · Accepted Answer · 2017-05-23 12:33:33Z

6

I had the exact same issue (I'm very new to Rails). I eventually solved the issue by rearranging the order of files within application.js:

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap

For the javascripts to work in development, "require jquery" needed to be after "require twitter/bootstrap." In production, jquery needed to come first. Not sure what caused this, but it now works when deployed to Heroku.

I used these two posts:

javascript - Twitter bootstrap jquery plugins not compiled for production

twitter bootstrap drop down suddenly not working

edited May 23, 2017 at 12:33

CommunityBot

11 silver badge

answered Jun 27, 2012 at 19:25

TaylorT

2083 silver badges9 bronze badges

1 Comment

Greg Over a year ago

Rails 4.2.5 update: //= require jquery //= require jquery_ujs //= require bootstrap //= require angular //= require 'leaflet.js' //= require leaflet //= require_tree . Dropdowns work on Heroku, but bootstrap needs to be second on localhost. Is there a way to fix this or at least have it work on both Heroku and localhost without changing application.js? PS. Can't seem to format comments.

pipebender · Accepted Answer · 2013-08-03 05:07:51Z

5

Check your production.rb file. I believe the line needs to be:

config.assets.compile = true

I believe this gets set to false by default.

answered Aug 3, 2013 at 5:07

pipebender

532 silver badges5 bronze badges

1 Comment

Alex Over a year ago

Warning: Richard Hulse advises not to turn this on here: stackoverflow.com/questions/8821864/…

Stephen Burke · Accepted Answer · 2014-09-16 18:32:26Z

2

Remember that everything that you would normally do on localhost, you must be doing with heroku. Make sure you heroku run rake assets:precompile.

answered Sep 16, 2014 at 18:32

Stephen Burke

4593 silver badges15 bronze badges

Comments

amitamb · Accepted Answer · 2012-04-30 21:22:32Z

1

I also had similar problem but the problem was happening on localhost as well.

You are probably using rails-bootstrap gem. It installs a file bootstrap.coffee.js This file was culprit. It had .popover use and relevant plugin was not included. I commented that out as I was not using it anyway but you should consider including the popover plugin for bootstrap.

answered Apr 30, 2012 at 21:22

amitamb

1,06711 silver badges22 bronze badges

1 Comment

Kick Buttowski Over a year ago

I followed what you said and as soon as I deleted my coffee file , all is working, yet I wanna know do you have any source to back your claim?

CGK · Accepted Answer · 2015-05-09 02:39:20Z

1

Checked the minified js for my app, and popover was twice in the file.

Be sure that only one of bootstrap and boostrap-sprockets is declared in your javascript assets

From the docs:

bootstrap-sprockets and bootstrap should not both be included in application.js.

bootstrap-sprockets provides individual Bootstrap Javascript files (alert.js or dropdown.js, for example), while bootstrap provides a concatenated file containing all Bootstrap Javascripts.

Be sure that only one of bootstrap and bootstrap sprockets

Refs: bootstrap-sass github issue and here.

answered May 9, 2015 at 2:39

CGK

2,66222 silver badges24 bronze badges

Comments

vladiim · Accepted Answer · 2018-08-24 04:47:57Z

0

Updating sprockets worked for me: bundle update sprockets

answered Aug 24, 2018 at 4:47

vladiim

1,9802 gold badges21 silver badges29 bronze badges

Comments

Anthony To · Accepted Answer · 2017-09-15 22:21:36Z

-1

If you've already tried heroku run rake assets:precompile and the JS still isn't working, try doing heroku restart to restart the server after precompiling assets.

answered Sep 15, 2017 at 22:21

Anthony To

2,3532 gold badges22 silver badges31 bronze badges

Collectives™ on Stack Overflow

Javascript features work on localhost but not when deployed to Heroku

8 Answers 8

2 Comments

1 Comment

1 Comment

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

8 Answers 8

2 Comments

1 Comment

1 Comment

Comments

1 Comment

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related