AngularJS App：如何将.js文件包含到index.html中

Question

我是angularJS的新手。 我设法使用angularJS构建了一个phonegap应用程序。 该应用程序还可以，运行得很好。 问题是，现在我对angularJS的工作方式有了更多的了解（至少我认为我有），我担心我的app文件结构和代码可维护性。 我的项目遵循角度种子模式。 GitHub上的Angular Seed ，我有这个结构：

js
   app.js
   controllers.js
   directives.js
   services.js
   filters.js

在研究了如何使用angularJS构建应用程序后，我发现了一些非常好的文章： 使用AngularJS构建Huuuuuge应用程序以及如何 构建 大型角度应用程序

我的问题对我来说似乎很愚蠢，但我无法找到出路。 我设法将我的控制器分成不同的文件，现在我有了这个结构：

scripts
    controllers
             LoginCtrl.js
             HomeCtrl.js
             AboutCtrl.js
             ClientCtrl.js 

我正在努力的事情是，在我之前的应用程序的方式，我只有一个controller.js文件。 在我的index.html文件中，我通常使用脚本标记加载所有脚本文件。 现在我的控制器有4个不同的.js文件，如何将它们加载到我的index.html文件中？ 我是否必须在那里加载它们？

我在index.html文件中加载所有脚本看起来并不正确（我知道有一个文件代码将以相同的方式加载，对我来说，包含很多脚本标签对我来说很奇怪） 。 我在github上找到了ng-boilerplate项目，在他们的index.html上，他们动态加载脚本。 问题是，我现在无法启动新的ng-bolierplate，我找不到他们是如何做到的。 抱歉，长篇文章。 谢谢！

Answer 1

在index.html中引用每个脚本文件在其自己的标记中绝对是一种方法，而且最直接。 但是，如果您想要更清洁的东西，请查看将Angular与RequireJS结合使用的各种指南之一：

http://www.startersquad.com/blog/angularjs-requirejs/

将Require.js与Angular.js一起使用是否有意义？

这种方法主要是为了解决加载文件的顺序以满足依赖性的问题，但它也有清理index.html的结果......尽管以其他地方的额外配置为代价。

Answer 2

使用http://browserify.org/

您可以从浏览器中的node.js获得非常简单和优雅的commonjs模块以及许多令人惊叹的库。

代码被捆绑到单个js文件中。