In my application.js file, I have:

//= require jquery
//= require jquery_ujs
//= require underscore
//= require backbone
//= require_tree .
//
//= require .//community_app
//
//= require_tree ../templates/
//= require_tree .//models
//= require_tree .//collections
//= require_tree .//views
//= require_tree .//routers

but the generated html doesn't obey this order:

<head>
  <title>CommunityApp</title>
  <link href="/assets/application.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/communities.css?body=1" media="all" rel="stylesheet" type="text/css" />
<link href="/assets/home.css?body=1" media="all" rel="stylesheet" type="text/css" />
  <script src="/assets/jquery.js?body=1" type="text/javascript"></script>
<script src="/assets/jquery_ujs.js?body=1" type="text/javascript"></script>
<script src="/assets/underscore.js?body=1" type="text/javascript"></script>
<script src="/assets/backbone.js?body=1" type="text/javascript"></script>
<script src="/assets/collections/communities.js?body=1" type="text/javascript"></script>
<script src="/assets/community_app.js?body=1" type="text/javascript"></script>
<script src="/assets/home.js?body=1" type="text/javascript"></script>
<script src="/assets/models/community.js?body=1" type="text/javascript"></script>
<script src="/assets/application.js?body=1" type="text/javascript"></script>
  <meta content="authenticity_token" name="csrf-param" />
<meta content="ktrLMDYSJaU/mmgmzfpxDfMin7OCXga4K5gVIJZHJUI=" name="csrf-token" />
</head>
<body>

Collections is loaded before the model which gives me error on the front-end. How can I make it so it loads in a specific manner the js files? thanks

Edit
Report