将目录中的所有javascript文件包含到angularjs中的html文件中?咕哝? [英] Include all javascript files in a directory to a html file in angularjs? with grunt?

问题描述

在我的 AngularJS 应用中，我有很多控制器 js 文件.

In my AngularJS app, I've many controllers js files.

这些控制器(one.ctrl.js,two.ctrl.js,...)需要包含在我的<代码>index.html 文件.

These controllers (one.ctrl.js,two.ctrl.js,...) needs to be included in my index.html file.

目录结构:

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

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

Currently, above js files are included in index.html file as follows.

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 中.

There are gonna be more *.ctrl.js files which are required to be included in index.html.

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

I need a way to automatically include all the *.ctrl.js files in controllers directory to index.html.

调查结果:

来自一些 SO 问题，

From some SO questions,

在 AngularJS 的文件夹中加载 JavaScript 和 CSS 文件

我该怎么做通过 JavaScript 文件将所有 JavaScript 文件包含在一个目录中?

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

I found that it cannot be done automatically and needs some server side scripting or build tools.

我的问题:

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

Currently, I'm using yeoman which include grunt for build tool. So, my question is, How can those javascript files in a directory be automatically included in a html file?

推荐答案

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

使用它你可以定义这样的模板:

Using it you can define templates like these :

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

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

in your html file which will be expanded to include all your source js and css files present in your source location which can be configured in the grunt task

这篇关于将目录中的所有javascript文件包含到angularjs中的html文件中?咕哝?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！