//= require jquery //= require jquery_ujs //= require_self //= require_tree .
That reads as:
- process jquery, then jquery_ujs
- process anything in this file (self)
- process all the files in this directory tree (require_tree)
I don't have many JS files in my app - three custom JS files written by myself and a couple of third party libraries.
I try and follow defaults as far as possible but require_tree has two BIG problems.
First is that it processes ALL the files in the directory tree.
Second is that the ORDER is UNDEFINED.
So one problem with require_tree is that it will process both a 'native' and minimized version of the same library is both are present. That results in the same functions being defined multiple times - and that seems to be a real problem if a library includes it's own copy of jQuery.
Not specifying the order of processing is the other BIG issue. For libraries with a 'core' JS file along with others will typically require that the core library is processed first.
In my example, my application.js file becomes:
//= require jquery //= require jquery_ujs //= require ./tabs_timeline_simple //= require ./tandem_select //= require ./raphael-min //= require ./facebox
I strongly recommend that you start out with everything clearly defined like this. Once you have it all working then you can remove unused files and simplify application.js - if not, you risk going through the same debugging misery that I just went through.