如何设置观察者将文件复制到同一文件夹内的其他文件?

How can I set up a watcher to copy files to other files inside same folders?

这是我目前所拥有的和我尝试过的:

在我的应用程序中,我有这样结构的文件

/app/learn/content/ab.html
/app/learn/content/bc.html
/app/learn/content/base.html
/app/write/content/ab.html
/app/write/content/bc.html
/app/write/content/base.html
/app/xx/ab.html
/app/xx/bc.html
/app/xx/base.html

我这样设置观察者:

var abc = {
    src: [
        '**/ab.html',
        '**/bc.html',
    ],
}
gulp.task('watchHTMLs', function () {
    gulp.watch(abc.src, function (file) {
        return gulp.src(path.basename(file.path))
          .pipe(rename('base.html'))
          .pipe(gulp.dest('./'));
    })
});

我想做的是查看具有 ab.html 或 bc.html 文件名的文件,然后在发生更改时将这些文件复制到同一目录中的 base.html。但是到目前为止,我的观察者启动了,但是当我更改 ab.html 或 bc.html 文件之一时,什么也没有发生。守望者似乎甚至没有开火。

谁能指出我做错了什么?

在整个项目中使用未限定范围的 globstar ** 不是一个好主意。 **/ab.html 匹配项目所有文件夹中的 ab.html,包括 node_modules。根据 node_modules 中嵌套文件夹的数量,这可能需要很长时间才能完成。如果有的话。

此外,您从 gulp.watch() 收到的 file 只有绝对路径,因此您需要将当前工作目录的 base option 提供给 gulp.src()

最后,您只想更改 file 的名称,而不是整个路径。使用 gulp-renamebasename 选项。

所有这些加起来:

var abc = {
  src: [
    'app/**/ab.html',
    'app/**/bc.html'
  ],
};
gulp.task('watchHTMLs', function () {
  gulp.watch(abc.src, function (file) {
    return gulp.src(file.path, { base: process.cwd() })
      .pipe(rename({basename:'base'}))
      .pipe(gulp.dest('./'));
  });
});