gulp中的Typescript指令html模板答案

【问题标题】：Typescript directive html template in gulpgulp中的Typescript指令html模板
【发布时间】：2016-03-13 12:51:48
【问题描述】：

我正在考虑从 Grunt 切换到 Gulp，除了一件事之外，我拥有一切我需要工作的东西。

当我使用 Grunt 时，我使用了 grunt-ts，它有一个非常好的功能来处理 html 模板的角度指令。 https://www.npmjs.com/package/grunt-ts#html

它使用我的指令模板 html 文件并为其创建一个 .ts 文件。这非常适合我们的构建过程，因为所有 .ts 文件都被编译并连接到一个文件中。现在，当我使用 gulp-typescript(https://www.npmjs.com/package/gulp-typescript) 时，我不再拥有此功能。有没有办法重新创建从 grunt-ts 到 Gulp 工作流的功能？

基本上，我需要做的是：

查看指定目录中的所有 *.tpl.html 文件。【没问题】

当文件更改时，缩小文件中的 html 内容（使用 gulp-minify-html）并将缩小后的 html 内容添加到具有此文件内容的新文件（在同一目录中）：

module [directivename].tpl{ 
    export var html ='MINIFIEDHTML';
}

关于如何完成此任务的任何建议？还是有更好的方法来做到这一点？ `

【问题讨论】：

标签： angularjs typescript gulp

【解决方案1】：

我相信 gulp-angular-templatecache 是您所需要的。

var templateCache = require('gulp-angular-templatecache');

gulp.task('default', function () {
  return gulp.src('templates/**/*.html')
    .pipe(templateCache())
    .pipe(gulp.dest('public'));
});

您可以从here 看到 John papa 是如何做到这一点的

【讨论】：

谢谢，看起来很有希望！我会试试看。