Search code examples
node.jsfunctional-programmingstreamgulp

How to add a prefix on gulp-search-replace


I have no idea how to ask this but it seems to be a fairly simple thing.

In this gulp task every occurrence of "old" is replaced with "new" on a bunch of files.

gulp.task('prefix-replace', function () {
    return gulp.src('svg/*')
        .pipe(replace('old', 'new'))
        .pipe(gulp.dest('dist/'));
});

How to get the name of the file (or index or any unique id), so replacements would have a unique prefix for each file?

I tried with uuid:

gulp.task('prefix-replace', function () {
    return gulp.src('svg/*')
        .pipe(replace('old', uuidv4() + 'new'))
        .pipe(gulp.dest('dist/'));
});

But this generates the SAME id for every replacement in all files (I know that's not a for loop but I'm struggling with streams at the moment as you can clearly see).

This will generate a new id for EVERY replacement, which is also not what I'm looking for:

gulp.task('prefix-replace', function () {
    return gulp.src('svg/*')
       .pipe(replace('term', function() {
            return uuidv4() + 'term'
        }))
        .pipe(gulp.dest('dist/'));
});

How to get a unique id for each file?


Solution

  • gulp-replace with file object does have access to a vinyl file reference which you can use to get the current file name like so:

    gulp.task('prefix-replace', function () {
        return gulp.src('svg/*')
           .pipe(replace('term', function() {
                return this.file.relative + ': term'
            }))
            .pipe(gulp.dest('dist/'));
    });
    

    this.file.relative is a string so you can use string operations on it if need be (such as stripping off the extension). this.file.path gives you the full path to the current file.