Gulp.js - Inject project details at the beginning of the file

Question

At the beginning of my JavaScript file I have a comment that host the project details like this:

// { project name } 
// { project website }
// { author }

For instance it should look like this

/// FoobarProject 2.0.1
/// www.foobar.com/foobarproject
/// John Doe <john.doe@hotmail.com>
;(function(){
   //...
 }());

What is the best way to align these details with my package.json? So when I update the version in the package.json and execute my "build" task, gulp should update the version.

I do not like the idea to have two file:

1. File "A" that uses placeholders (eg {{ version }})
2. File "B" that is the outcome of the build process where placeholders are populated with the values.

I prefer the approach that the build-task replaces the values in my file directly. Furthermore after the minifier (uglify) is executed this comment should be prefixed.

So my question boils down to: What is the best approach to implement "replaceFirstThreeLinesWith":

gulp.task('inject-projectdetails', function(){

    var header = [ 
        util.format('// FoobarModule.js %s', pkg.version), 
        util.format('// %s', pkg.homepage),
        util.format('// %s', pkg.author),
        ].join('');

    return gulp.src('FoobarModule.js')
        .pipe( replaceFirstThreeLinesWith(header) )
        .pipe(gulp.dest('.') );
});

Answer 1

您可以使用gulp-header插件： https : //www.npmjs.com/package/gulp-header