在Rails应用程序中加载自定义javascript文件

Question

I developed a javascript diagram tool (using kineticjs), and need to load some different js files. But they need to be load in order. I manage to do that this way:

inside a specific view (in the top of the file):

<%= javascript_include_tag "kinetic" %>
<%= javascript_include_tag "diagramtool/diagramtool0" %>
<%= javascript_include_tag "diagramtool/diagramtool1" %>
<%= javascript_include_tag "diagramtool/diagramtool2" %>
<%= javascript_include_tag "diagramtool/diagramtool3" %>
<%= javascript_include_tag "diagramtool/diagramtool5" %>
<%= javascript_include_tag "diagramtool/diagramtool6" %>

this in assets.rb:

# Be sure to restart your server when you modify this file.

# Version of your assets, change this if you want to expire all your assets.
Rails.application.config.assets.version = '1.0'

# Precompile additional assets.
# application.js, application.css, and all non-JS/CSS in app/assets folder are already added.
# Rails.application.config.assets.precompile += %w( search.js )

Rails.application.config.assets.precompile += %w( kinetic.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool0.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool1.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool2.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool3.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool5.js )
Rails.application.config.assets.precompile += %w( diagramtool/diagramtool6.js )

And the files are located in assets/javascripts/diagramtool

The problem is that they are not load in order when I move to the view that has the code above to load the files. But if I refresh the page they are load in order!

So, my questions are

How can I assure the js files are load in order? Why the files are load in order when I refresh the page? And why they are not load in order when I navigate through the application?

There is another way to do this? I tried to do it in application.js using the asset pipeline with the "require" key word. But I don't know how to do it there.

I also tried to put all the code in one file, but the file is load before the kinetic file! And I get errors because I need to load the library file first. But if I refresh the page it works again.

Any help? I don't really know what to do, to have this working properly. I'm new at Ruby on Rails, and I'm still learning how to do this kind of "configurations".

Edit: I'm not using the application.js to load the js files, because I wasn't able to do it that way. But here it is:

//= require jquery
//= require bootstrap-sprockets
//= require jquery
//= require jquery_ujs
//= require turbolinks

/* 
 require kinetic
 require diagramtool
 require_tree . 
 */

Answer 1

Just solved it this way:

created a manifest file diagrams.js:

//= require diagramtool/kinetic
//= require diagramtool/diagramtool0
//= require diagramtool/diagramtool1
//= require diagramtool/diagramtool2

Added this in the view:

<%= javascript_include_tag "diagrams" %>

Using the asset pipeline with a manifest file.