How to Copy Multiple Files and Keep the Folder Structure with Gulp

How to copy multiple files and keep the folder structure with Gulp

To achieve this please specify base.

¶ base - Specify the folder relative to the cwd. Default is where the glob begins. This is used to determine the file names when saving in .dest()

---

In your case it would be:

gulp.task('move-css',function(){
  return gulp.src([
      './source/css/one.css',
      './source/other/css/two.css'
  ],  {base: './source/'}) 
  .pipe(gulp.dest('./public/assets/'));
});

Folder structure:

.
├── gulpfile.js
├── source
│   ├── css
│   └── other
│       └── css
└── public
    └── assets

Copy folder with it's content in gulp

I would do it like this:

gulp.task('move-dependencies', function () {
    var task1 = gulp.src(['node_modules/@bower_components/**'])
                .pipe( gulp.dest(src + '/bower_components') );
    var task2 = gulp.src(['node_modules/jquery-powertip/**'])
                .pipe( gulp.dest(src + '/bower_components/jquery-powertip') );
    return [ task1, task2 ]; // or merge(task1, task2);
});

How to compile the file and keeping same folder structure using gulp?

It seems like most of this code could be tossed if you used a glob like src/pug/**/*.pug to grab all files in a folder recursively - then pipe to dest('test'). The way you're combining folders is most likely where the bug is.

gulp.task("html", function() {
  return gulp.src([ 'src/pug/**/*.pug', '!src/pug/includes/**/*.pug' ])
    .pipe(pug())
    .pipe(gulp.dest('test'));
});

Gulp: preserving folder structure on destination for individual files

In order to preserve hierarchy you should pass {base: "."} parameter to the gulp.src. Something like this:

gulp.task('foo', function(){
    var files = [
        path.join(__dirname, 'c.txt'),
        path.join(__dirname, 'a/a.txt')
    ];
    gulp.src(files, {base: '.'})
        .pipe(gulp.dest(path.join(__dirname, build));
});

gulp Copy from multiple locations, dont preserve structure

When writing to the dest() location gulp strips away a base path from the path of every file. If no explicit base path is provided, gulp (actually vinyl-fs) assumes everything up to the first glob to be the base path.

In your case that means that 'path/to/wp/my-mu-plugins/' is assumed to be the base path for everything matching 'path/to/wp/my-mu-plugins/**/build/theme/images/**/*'.

While you can specify an explicit base path using the base option to src() this isn't of much use to you, since the base option doesn't support globbing and you don't know which or how many subdirectories match 'my-mu-plugins/**'.

However you can use the base option to disable the default behavior and then strip everything up to and including the /images/ folder from the path using gulp-rename:

gulp.task('default', function() {
  return gulp.src(files, { base:'./' })
    .pipe(rename(function(path) {
      path.dirname = path.dirname.replace(/(.*)?\/images\/?/, '');
    }))
    .pipe(gulp.dest('public_html/assets/images/'));
});

Gulp copy files from all subfolders to destination and flatten one level

You can use gulp-rename to solve this kind of problems and simply pipe the matched file names as:

var gulp = require('gulp'),
rename = require('gulp-rename');

var folders = ['hello/*.**'];

gulp.task('default', function() {
    return gulp.src(folders, { base: '.' })
               .pipe(rename(function(path) {
                  console.log(path)
                  path.dirname = path.basename;
              }))
        .pipe(gulp.dest('./dist'));
});

This is my folder structure before the transformation:

And this my folder structure after running gulp:

---

Related Topics