Use gulp to select and move directories and their files

The original question targets only directories (a.k.a. folders) in its gulp.src, i.e. gulp.src(['_locales', ... in this example, _locales is the name of a directory.

The accepted answer uses a glob pattern in its gulp.src to target files anywhere in those directories, i.e. gulp.src(['./_locales/**/*.*', ..., (notice the double-asterisks, and the filename.extension asterisks). The accepted answer works...

...but the accepted answer only emphasizes the base option:

You need to include the base option to src...

I experimented and found:

  1. Strictly speaking, it is unnecessary to use the base option to achieve what the OP asked: "...and moves the appropriate files to the clean directory." The base option does indeed preserve the folder+file structure (as described in the accepted answer), but the base option is not sufficient to move the files as the OP asked. Preserving the folder+file structure is probably what the OP expects, so the accepted answer is good, but...

  2. Just to reiterate what does move the files, it's the glob patterns:

    1. Double-asterisk (.../**/...) searches recursively throughout all subfolders, and subfolders' subfolders', etc.

    2. Filename.extension asterisks (.../*.*) finds files of all names, and all extensions. So I think this part deserves the most emphasis!

  3. The accepted answer changes something else; it adds a prefix of ./ to each path arguments passed to gulp.src. I think that's unnecessary/redundant; if there is no ./, (as in the OP question), the paths are resolved relative to the current directory -- resulting in the same behavior. But maybe it's good practice to be explicit with the ./

Let me know if I'm mistaken...


You need to include the base option to src, which will preserve the file structure the way you want:

var filesToMove = [
        './_locales/**/*.*',
        './icons/**/*.*',
        './src/page_action/**/*.*',
        './manifest.json'
    ];

gulp.task('move',['clean'], function(){
  // the base option sets the relative root for the set of files,
  // preserving the folder structure
  gulp.src(filesToMove, { base: './' })
  .pipe(gulp.dest('dist'));
});

Also, you are probably going to have trouble down the road if you have all these source files in the root of your project.

If you can, I'd recommend you use a single src/ folder and move all your application-specific files into there. This makes maintenance easier moving forward, and prevents your build-specific files from getting mixed up with your application-specific files.

If you do this, then simply replace all occurrences of ./ with src/ in the example above.

Tags:

Glob

Node.Js

Gulp