模块化 AngularJS 应用程序：一个或多个 AngularJS 模块？

Question

我尝试使用 AngularJS 构建模块化应用程序。我的第一个想法是使用这种文件夹结构按功能对每个模块进行分组：

/core 
    controllers.js
    directives.js
    app.js
/modules
     /users
        controllers.js
        directives.js
     /invoices
        controllers.js
        directives.js
     /messages        
        controllers.js
        directives.js
     ...

请注意，“核心”文件夹包含始终存在于应用程序中的基本功能。其他模块可以独立添加或删除。

由于我的应用程序很大，我也想使用延迟加载。我实现了这个解决方案：http://ify.io/lazy-loading-in-angularjs/ 这在我看来实际上是最简单的方法。问题是它只对控制器、服务、指令进行延迟加载……而不是对 AngularJS 模块。

我知道还有另一种方法可以延迟加载 Angular 模块 (http://blog.getelementsbyidea.com/load-a-module-on-demand-with-angularjs/)，但我认为它使用 Angular 的核心方法太老套了。

我的问题是：在我的情况下，为我的每个模块使用不同的 AngularJS 模块是否有意义，如下所示：

angular.module('core', ['ngRoute', 'users', 'invoices', 'messages'])
angular.module('users')
angular.module('invoices')
angular.module('messages')

这种方法的优势是什么？ AngularJS 模块是否有用 - 目前 - 仅适用于 Angular 的第三方模块？

我问这个是因为 AngularJS 2.0 将支持本机延迟加载。来自 Google 的 Miško Hevery 说“[you] 应该按视图分组，因为视图将在不久的将来延迟加载”，并且我们应该为每个应用程序使用一个模块，请在此处查看：https://www.youtube.com/watch?v=ZhfUv0spHCY&t=34m19s

大型应用程序只为我的应用程序使用一个模块是否正确：

angular.module('core', ['ngRoute']);

然后基于路由或视图延迟加载我的控制器、服务和指令？

Answer 1

我们的结构（在一个非常大的应用程序上）与您在此处提议的结构相似，但没有将控制器、服务等捆绑到单个 .js 文件中。相反，我们只是将我们的关注点与视图、服务等都捆绑到一个模块中。所以每个有意义的组件可能看起来像：

/my-component
    - i-do-something.js
    - a-view.html
    - a-view-that-is-a-child.html
    - a-view-ctrl.js
    - index.js //the thing that creates a module and returns it
    / tests
         - i-do-something-spec.js
         - a-view-ctrl-spec.js

所有这些都捆绑到一个应用程序模块中（以我们的组织命名）。然后一个简单的引导模块angular.bootstrap(['app'])s 整个事情。 我们使用browserify 编译所有这些东西，到目前为止它运行良好。