javascript - 将目录中的所有 JavaScript 文件包含到 AngularJS 中的 html 文件中？咕噜声？

Question

在我的 AngularJS 应用程序中，我有很多 Controller js 文件。

这些 Controller (one.ctrl.js、two.ctrl.js、...)需要包含在我的 index.html 文件。

目录结构:

app/
   js/
      controllers/
         one.ctrl.js
         two.ctrl.js

目前，上述js文件包含在index.html文件中，如下所示。

index.html:

<!--   other html components   -->

<script src="js/controllers/one.ctrl.js"/>
<script src="js/controllers/two.ctrl.js"/>
</body>
</html>

将有更多 *.ctrl.js 文件需要包含在 index.html 中。

我需要一种方法来自动将 controllers 目录中的所有 *.ctrl.js 文件包含到 index.html 中。

调查结果:

从一些SO问题来看，

Load JavaScript and CSS files in folders in AngularJS

How can I include all JavaScript files in a directory via JavaScript file?

我发现它无法自动完成，需要一些服务器端脚本或构建工具。

我的问题:

目前，我正在使用 yeoman，其中包括 grunt 作为构建工具。所以，我的问题是，目录中的那些javascript文件如何自动包含在html文件中？

Answer 1

您可以使用grunt-include-source插件

使用它您可以定义如下模板:

html: {
    js: '<script src="{filePath}"></script>',
    css: '<link rel="stylesheet" type="text/css" href="{filePath}" />',
  }

在您的 html 文件中，该文件将扩展为包含源位置中存在的所有源 js 和 css 文件，这些文件可以在 grunt 任务中配置