Grunt.js 加入 .html 文件（用字符串包围内容）并将结果注入单个文件的任务？

Question

我有很多 .html 个文件（AngularJS 个模板），我想将它们合并到一个文件中，读取它们的所有内容并用 <script> 标记包围这些内容。

示例：

/path/to/a.html
/path/to/b.html

内容：

<!-- a.html -->
<h1>I'm A</h1>

<!-- b.html -->
<h1>I'm B</h1>

通缉任务结果（output.html）：

    <!-- html, body, etc -->
    <script type="text/ng-template" id="/path/to/a.html">
        <h1>i'm A</h1>
    </script>
    <script type="text/ng-template" id="/path/to/b.html">
        <h1>i'm B</h1>
    </script>
</body>

最后，我想自定义模板的 id（.html 模板的完整路径），如果需要可以缩短路径。

编辑：多亏了评论，我才能够做这样的事情：

grunt.initConfig({
    concat: {
        options: {
          process: function (src, filepath) {
            return '<script type="text/ng-template" id="'+filepath+'">\r\n'+src+'</script>\r\n';
          }
        },
        dist: {
            src: ['partials/**/*.html'],
            dest: 'dist/out.html',
        },
    }
});

但是如何将 dist/out.html 定义为模板本身（将输出插入占位符）？

Answer 1

来自评论：

您应该能够使用 grunt-contrib-concat.

将所有 angular 模板组合在一起

可以使用 grunt-insert 之类的方式将连接文件插入到设计文件中，或者如您所见，grunt-html-build。

Grunt.js 加入 .html 文件（用字符串包围内容）并将结果注入单个文件的任务？

Grunt.js task for joining .html files (surrounding content with a string) and injecting the result into an single file?

angularjs

gruntjs