Gulp 部分删除目录结构

Gulp partially remove directories structure

我的目录结构与此类似:

app/
  directory1/
    assets/
      images/
      js/
  directory2/
    assets/
      images/
dist/
  assets/
    images/
    js/

我尝试使用 Gulp 实现的是 "gather" 目录 1、2... 中的资产并将它们放入 dist/assets/ 所以我这样写:

gulp.task('gather-assets', function() {
  gulp.src('app/*/assets/**').pipe(gulp.dest('dist/assets/'));
});

问题是在 运行 这个函数之后它会创建一个这样的路径:

dist/assets/directory1/assets/images

根据 this question 的建议,我尝试使用 gulp-rename,但我的情况不同,如果我这样使用 gulp-rename:

gulp.task('gather-assets', function() {
  gulp.src('app/*/assets/**').pipe(rename({dirname: ''})).pipe(gulp.dest('dist/assets/'));
});

它肯定会删除 * 星号处不必要的路径,但它也会删除 ** 路径。因此 images/ 和 js/ 中的文件将被复制到 assets/ 而没有子目录。对于这种情况,我可以使用什么解决方案?

Gulp-flatten 适合你。

var flatten = require('gulp-flatten');

gulp.task('gather-assets', function() {

  return  gulp.src('app/*/assets/**')
    //  .pipe(rename({ dirname: '' }))

    // -2 will keep the last two parents : assets/images or assets/js
   .pipe(flatten({ includeParents: -2 }))

   .pipe(gulp.dest('dist'));
});

如果您想使用 gulp-rename:[gulp-flatten 和 gulp-rename 都只是对每个文件的目录结构进行字符串操作]

 //   .pipe(flatten({ includeParents: -2 }))

 .pipe(rename(function (file) {

    let tempArray = file.dirname.split(path.sep);

    // remove the first array item : directory1 or directory2
    // rejoin the remaining array items into a directory string

    let temp = tempArray.slice(1).join(path.sep);

    file.dirname = temp;
  }))