Question

最少需要做的事情：

关注文件更改并更新dist/**中的文件，如icon.png，abc.css，main.js至icon1783.png，abc84848.css，{{ 1}}。
相应地更新源地图名称。 sourcemap的名称应与js文件相同，因为源映射的哈希值与缩小的js文件不同。
最后，以某种方式以某种方式更新视图中的引用。根据我的需要，使用正确的引用更新main7272.js下的pug模板。为所有（js | css | img）。

Answer 1

模块gulp-hash可以满足您的需求。它可以为您的文件名添加哈希，并创建一个清单JSON文件，将原始文件映射到哈希版本。然后，您可以引用此清单JSON文件来提供文件的散列版本。

以下是一个Gulpfile示例，它监视JavaScript更改，缩小文件，使用哈希对其进行版本化，将其映射到JSON文件中，并删除旧的过时版本：

import gulp   from 'gulp';
import {exec} from 'child_process';
import hash   from 'gulp-hash';
import uglify from 'gulp-uglify';

// Minifies main.js
gulp.task('script', () => {
  exec('rm dist/scripts/main-*.min.js') // Deletes old hashed app JS file
  return gulp
    .src('dis/scripts/main.js') // Source file
    .pipe(uglify()) // Minifies the file
    .pipe(hash({ template: '<%= name %>-<%= hash %>.min<%= ext %>' })) // Adds randomly generated hash to JS file name
    .pipe(gulp.dest('dist/scripts/`)) // Adds hashed JS file to destination dir
    .pipe(hash.manifest('hashed-assets.json')) // Writes manifest JSON file
    .pipe(gulp.dest(dist/)); // Adds manifest some destination dir
});

// Watch main.js file for changes
gulp.task('watch', () => {
  gulp.watch('dist/scripts/main.js', ['script']);
});

// Default task
gulp.task('default', ['script', 'watch']);

现在，您的main.js文件夹中有main-87362721.min.js和dist/scripts/。在您的dist/文件夹中，您还会hashed-assets.json，如下所示：

{"main.js":"main-87362721.min.js"}

当您对main.js进行更改时，监视任务会注意到您已更改文件并将触发脚本任务。

你在问题中如何做＃1和＃2。＃3我必须离开熟悉Pug.js的人，但总的目标是引用hashed-assets.json文件并迭代每个密钥以提供其值。

是否有使用Gulp缓存清除的完整解决方案？

1 个答案: