Gulp.js get filename from .src()

Question

I'm trying to use gulp-proceesshtml ( https://github.com/julien/gulp-processhtml ) to remove some unwanted code in my build version, the problem is that the task requires a filename to be given.

gulp.src('test.html').pipe(processhtml('test.html'));

But I can't figure out how this would work when I'm processing all HTML files in a folder

gulp.src('*.html).pipe(processhtml('filename here'));

Answer 1

Personally, it sounds like that's the wrong plugin for what you are trying to accomplish. See below .

However, because it's not clear what you are using it for, you can be able to use node-glob to process each file one-by-one:

var glob = require('glob')
    // you also need event-stream for merging the streams
    es = require('event-stream');

gulp.task('myTask', function() {
    var files = glob.sync('*.html'),
        streams;
    streams = files.map(function(file) {
                // add the *base* option if your files are stored in
                // multiple subdirectories
        return gulp.src(file, {base: 'relative/base/path'})
                // may need require('path').filename(file)
                .pipe(processhtml(file));
    });

    return es.merge.apply(es, streams);
});

This will create a single asynchronous stream out of every file that matches your initial pattern.

---

For simply removing some text from your files, you can use gulp-replace , like so:

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

gulp.src('*.html')
   // replaces all text between
   // <!-- remove-this --> and <!-- /remove-this -->
   .pipe(replace(/<!--\s*remove-this\s*-->[\s\S]*?<!--\s*\/remove-this\s*-->/g, ''));

Answer 2

I know this question is old, but for a shorter solution you can use gulp-tap , something like this:

.pipe(tap(function(file, t) {
    console.log(file.path);
 }))

if you need to use the filename in other step of the pipe you can store it in a variable and use it for next step.