Javascript 如何使用Gulp缓存新的应用程序构建？

我正在使用Gulp为应用程序构建一个可部署的构建。我想缓存所有的.js和.css文件，以便在部署新的构建时，用户需要检索新的“缓存崩溃”文件。例如，如果一个app.js文件存储在浏览器的缓存中，我希望在我的index.html中对app.js的引用如下所示：

<script src="app/js/app.js?v=1.2"></script>

/dist
 /css
  |_app.css
 /img
 /js
  |_ app.js
  |_ base.js 
 /vendor

 index.html

这段代码从我的app/目录（这是我从master/目录编译代码的结果）中获取所有代码，并使用我的所有js、css和供应商文件构建dist/目录

在此构建之后，我有一个dist/目录，如下所示：

<script src="app/js/app.js?v=1.2"></script>

/dist
 /css
  |_app.css
 /img
 /js
  |_ app.js
  |_ base.js 
 /vendor

 index.html

我尝试过使用几种不同的方法来修改这个dist目录，以有效地使它破坏缓存。我尝试过使用gulp cachebust和gulp rev all，但我认为这两种工具对于我正在尝试的工作来说都有点过头了

理想情况下，通过Gulp，我希望进入由Gulp构建生成的index.html文件，并修改我的所有脚本标记，以便在每个部署构建中我希望缓存的所有文件的末尾附加“？v=1.0”的查询字符串

---

如有任何答复/建议，将不胜感激。非常感谢

如果您只需要添加查询字符串，那么我建议使用gulp cache-bust

var cachebust = require('gulp-cache-bust');

gulp.src('./dist/index.html')
  .pipe(cachebust({
    type: 'timestamp'
  }))
.pipe(gulp.dest('./dist'));

这是它的特辑：