Looking for way to copy files in gulp and rename based on parent directory

Question

For each module I have some files that need to be copied over to the build directory, and am looking for a way to minimize the repeated code from this:

gulp.src('./client/src/modules/signup/index.js')
  .pipe(gulp.dest('./build/public/js/signup'));

gulp.src('./client/src/modules/admin/index.js')
  .pipe(gulp.dest('./build/public/js/admin'));

to something like this:

gulp.src('./client/src/modules/(.*)/index.js')
  .pipe(gulp.dest('./build/public/js/$1'));

Obviously the above doesn't work, so is there a way to do this, or an npm that already does this?

Thanks

Kirk Strobeck · Answer 1 · 2017-03-26T16:22:20.207

210

Not the answer, but applicable to this question's appearance in search results.

To copy files/folders in gulp

gulp.task('copy', () => gulp
  .src('index.js')
  .pipe(gulp.dest('dist'))
);

edited Mar 26 '17 at 16:22

answered Mar 02 '14 at 21:43

Kirk Strobeck

17,984
20
75
114

2

Hmmm... my gulp says this task completes, but the output file does not exist. – Tyguy7 Mar 27 '15 at 23:50
4

You've got to return the stream to let Gulp know when the task finishes. – Merott Jun 10 '15 at 16:20
3

I'm confused why an answer that says "not the answer" has more upvotes than the accepted answer that does answer the question. I'm not sure we should clutter SO with answers designed to make search engines do some particular thing as opposed to providing answers to the question. I think it's search engines' jobs to make something useful of what they get when they crawl the site. Just my $0.02 – jinglesthula Jun 23 '15 at 22:57
9

@jinglesthula It's a useful service to those who arrive at this question via search engines, regardless of how well the search engine is doing its job. I appreciate it. – jbkly Jun 24 '15 at 21:01
1

haha just realized this is more popular than the right question or right answer :P – Kirk Strobeck Jan 20 '16 at 01:16

score 131 · Accepted Answer · answered Jan 21 '14 at 04:35

131

The best way is to configure your base when sourcing files, like so:

gulp.src('./client/src/modules/**/index.js', {base: './client/src/modules'})
  .pipe(gulp.dest('./build/public/js/'));

This tells gulp to use the modules directory as the starting point for determining relative paths.

(Also, you can use /**/*.js if you want to include all JS files...)

answered Jan 21 '14 at 04:35

OverZealous

39,252
15
98
100

6

There must be a more dynamic way of doing this - what about when src files come from 2 different directories and you want to preserve their directories in dest? – Ivan Durst May 22 '15 at 00:48
1

@IvanDurst I managed this specific case with the OP (answer) code. using the base config **and** using the relative path from the gulp file to independent files and `./folder-example/**` full folders and files. – Caio Wilson Feb 26 '16 at 16:11

score 5 · Answer 3 · edited Oct 29 '14 at 14:59

5

return gulp.src('./client/src/modules/(.*)/index.js')  
  .pipe(gulp.dest('./build/public/js/$1'));

Worked for me !

edited Oct 29 '14 at 14:59

Florent

12,310
10
49
58

answered Jan 20 '14 at 12:35

user2977367

61
3

.. even still, this *is* the answer. – Kirk Strobeck Mar 02 '14 at 21:41
2

...so can someone rewrite it so it _does_ work as is, so people coming to this page looking for that exact snippet of code can actually use it? – Ivan Durst May 22 '15 at 00:49
So... are parens and $n "backreferences" allowed in src/dest globs? They aren't regexes, afaik. This looks like what I'm looking for but the vinyl-fs docs are rather terse on the .src() and .dest() options and what's allowed in them and how they work. – jinglesthula Jun 23 '15 at 23:04

score 3 · Answer 4 · answered Nov 16 '15 at 17:54

Use for preserve input directory tree will be preserved.

.pipe(gulp.dest(function(file) {
    var src = path.resolve(SRC_FOLDER);
    var final_dist = file.base.replace(src, '');
    return DIST_FOLDER + final_dist;
}))

Using this, you can put in the src: .src(SRC_FOLDER + '/**/*.js').

The others answers not worked for me (like using base: on src()}, because some plugins flatten the directory tree.

score 0 · Answer 5 · answered Apr 02 '18 at 15:36

0

copy files in parallel

gulp.task('copy', gulp.parallel(
() =>  gulp.src('*.json').pipe(gulp.dest('build/')),
() =>  gulp.src('*.ico').pipe(gulp.dest('build/')),
() =>  gulp.src('img/**/*').pipe(gulp.dest('build/img/')),
)
);

answered Apr 02 '18 at 15:36

Dan Alboteanu

9,404
1
52
40

Looking for way to copy files in gulp and rename based on parent directory

5 Answers5

Linked