Angularjs include the javascript files

Question

Hello I'm using angularjs without jQuery (and want to stay in this status).

Now I'm including my javascript files like this:

<script src="bower_components/angular/angular.min.js"></script>
<script src="bower_components/angular-route/angular-route.min.js"></script>
<script src="bower_components/angular-touch/angular-touch.min.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap.min.js"></script>
<script src="bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/directives.js"></script>
<script src="js/services.js"></script>
<script src="js/filters.js"></script>

And it's not a good way. Becuase if I want to make a signle file for HomeController and a single file for AboutController I have to make 2 script tags.

There is any way to include those files from the app.js? (only when you see controller name then include it)

Thanks.

Answer 1

Man, use RequireJS to load dynamically. see https://github.com/tnajdek/angular-requirejs-seed . This project supports Angular.JS and uses RequireJS behind.

With RequireJS your index.html will have only 1 script include, see:

<script data-main="app/js/main" src="app/bower_components/requirejs/require.js">