Rails 4 - Javascript doesn't work after the deployment on Heroku

Question

Before the deployment I had the following error in the browser console:

ReferenceError: require is not defined npm.self-...js:2:0

Despite this, javascript works perfect on my local server. When I deploy my application on heroku it doesn't, but css does, so I'm not sure that a problem caused by asset pipeline. I have

group :production do
  gem 'pg'
  gem 'rails_12factor'
end

in my Gemfile. I tried to precompile assets locally and even via "heroku run" command, but it didn't change anything. Here's my application.js:

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require jquery
//= require jquery_ujs
//= require_tree .
//= require moment
//= require bootstrap-datetimepicker

$(function() {
  $("#datetimepicker").datetimepicker({
    locale: "en",
    format: "lll"
  });
});

$(function() {
  $("#events").on("click", ".pager a", function() {
    $.getScript(this.href);
    return false;
  });
});

And npm.js:

// This file is autogenerated via the `commonjs` Grunt task. You can require() this file in a CommonJS environment.
require('../../js/transition.js')
require('../../js/alert.js')
require('../../js/button.js')
require('../../js/carousel.js')
require('../../js/collapse.js')
require('../../js/dropdown.js')
require('../../js/modal.js')
require('../../js/tooltip.js')
require('../../js/popover.js')
require('../../js/scrollspy.js')
require('../../js/tab.js')
require('../../js/affix.js')

If you'll ask I might share the github link. Thank you!

Answer 1

Sorry, don't have enough reputation to comment, or else would have.

The require() function is not built into the browser. I suggest try removing

//= require_tree .

& manually adding your javascript files(only to test, you don't get the error) like this

//= require desired_js_file

//= require_tree . pre-compiles everything in asset/javascript 's root and serves to http request. And when the browser comes across a js file with require() function it probably gives you the error. Hope this helped!