Have you taken a look at organising your application by feature? This is how I organise my application…
Each feature is a self contained angular module.
Take the “myapp.login” feature for example:
angular.module('myapp.login', ['myapp.login.svc'])
.config(function($stateProvider) { ...login only states...})
.controller(function($scope, $state, loginSvc) { ...login only functionality... });
it is a module with controller and config methods. Only this feature’s states are defined in this feature’s config method. The myapp.logic.svc feature is also a module that myapp.login requires.
It makes it sooooo much easier to break down your app and work on discrete pieces of functionality. It also makes it easier to plug in features as and when, or take them out. Separation of concerns is clearly at play!
My app.js file now is the top-level module that “requires” which ever feature it needs.
Hope that A) makes sense, and B) is helpful!