如何用gulp删除templateCache?

时间:2017-05-31 12:31:48

标签: javascript angularjs gulp angularjs-templates

我使用angular-template-cache。 按照代码存在以删除应用程序模块中的模板缓存,但我需要在开发机器上删除所有带有gulp的templateCache。

myApp.run(function($rootScope, $templateCache) {
   $rootScope.$on('$viewContentLoaded', function() {
      $templateCache.removeAll();
   });
});

1 个答案:

答案 0 :(得分:1)

避免模板缓存的最佳方法是修改文件。

由于您使用的是gulp,因此您可以使用gulp-revgulp-rev-all修改文件。

什么是修订?

通过将内容哈希附加到文件名unicorn.cssunicorn-d41d8cd98f.css进行静态资产修订。

即,在每个版本中,文件名都会发生变化,从而避免模板缓存。 您可以修改每个文件,包括.html.css.jsimagesvideos等。

由于gulp-rev-all是最新版本并且来自gulp-rev,因此我们只讨论gulp-rev-all

使用gulp-rev-all进行修订:

var revAll = require('gulp-rev-all');

如果你想忽略修改中的某些文件,你可以这样做。

var rev = new revAll({dontRenameFile: [/^\/favicon.ico$/g, /^\/index.html/g]})

考虑所有文件都在dist文件夹中,并将新修订的文件保存在www文件夹中。(您也可以将它们保存在dist中。考虑www是你的构建目录。)

return gulp.src('dist/**')
  .pipe(rev.revision())
  .pipe(gulp.dest('www'))

接下来,创建一个manifest文件,将您的文件映射到已修订的文件。使用.manifestFile()函数。它返回一个转换函数,它将过滤掉通过管道的任何现有文件,并发出一个新的清单文件。必须在.revision()之后调用。

.pipe(rev.manifest())
.pipe(gulp.dest('www/manifest'));

将原始路径映射到修订路径的资产清单将写入www/manifest/rev-manifest.json

{
 "css/unicorn.css": "css/unicorn.098f6bcd.css",
 "js/unicorn.js": "js/unicorn.273c2cin.js"
 ..... 
 ..... 
}

完整代码:

gulp.task('rev', () => {
  var revAll = require('gulp-rev-all'),
    rev = new revAll({dontRenameFile: [/^\/favicon.ico$/g, /^\/index.html/g]});
return gulp.src('dist/**')
  .pipe(rev.revision())
  .pipe(gulp.dest('www'))
  .pipe(rev.manifest())
  .pipe(gulp.dest('www/manifest'));
});

详细了解gulp-rev-all here