Rails 3.1: javascripts not served correctly from vendor/assets directory?

Question

I have organized my javascript files in a couple of directories and I have found the following strange behavior. Given the following tree:

+ app
  + assets
    + javascripts
      + common
      + public
        + common
        + home
          - home.js

home.js looks like this:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require_directory ../../jquery_plugins
//= require_directory ../../common
//= require_directory ../common
//= require_self

Now the trick lies in the jquery_plugins directory. I placed this inside vendor/assets/javascripts (which is included in the asset load path, when I check Rails.application.config.assets.paths). When I do this I get the error: require_tree argument must be a directory. When I move that directory to app/assets/javascripts then everything works.

Does anybody have a clue as to what I'm doing wrong? Or is this a bug?

Answer 1

You could add a manifest file to the directory you are trying to serve with something like vendor/assets/javascripts/jquery_plugins/manifest.js

//= require_directory .

and require it in your app/assets/javascripts/application.js via

//= require jquery_plugins/manifest

Edit (even simpler way)

Thanks to @LeEnno for this

You can actually put all your single library related files in a folder named after the library for example vendor/assets/javascripts/bootstrap and in that same folder add an index.js which will act as your manifest and Rails will automatically pick it up

if in your

app/assets/javascripts/application.js

you add the line

//= require bootstrap

SO EASY!!!
Link to Rails Asset Pipeline Guide

Answer 2

I had the same problem. I'm still not sure if it's a bug or intentional behavior, but it seems that Rails.application.config.assets.paths only works for single files, i.e. require jquery and so on. Apparently the asset load paths are just used to return the best match for a single require but not for require_directoryor require_tree.

In my case, to load all files from vendor/assets/javascripts, I had to add the following to my app/assets/javascripts/application.js:

//= require_tree ../../../vendor/assets/javascripts/.

In your case something like this should work:

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require_directory ../../../../../vendor/assets/javascripts/jquery_plugins
//= require_directory ../../common
//= require_directory ../common
//= require_self

It seems that you always have to use the relative path from file where you're calling require_directory or require_tree.

Also, I found this discussion on the structuring of JS-assets to be helpful: Rails 3.1 asset pipeline and manually ordered Javascript requires