Add notices to auto-generated files with gulp
Published on 25 August 2015 at 14:17 by
I wrote a little tool today to pop into my gulp workflow which writes some text to the top of files processed by gulp. The problem I find is that quite often you can be working on a project with source files and generated files (e.g. jsx -> js) and accidentally edit the wrong file, only for your changes to be overwritten.
This tool will put a notice at the top of auto-generated files to hopefully help put a stop to that. There are other packages that do this too, but so far in the past week there have been about 10 releases of gulp-header and quite a few of them were broken. Also they originated from godaddy so confidence in the package is pretty low!
Usage
You can use the default notice:
var gulp = require('gulp'),
notice = require('gulp-notice');
gulp.task('default', function () {
gulp.src('src/*.js')
.pipe(notice())
.pipe(gulp.dest('dist/'));
});
Which will prepend files with:
/* --------------------------------------------------------------------- *\
| This code was auto-generated by a tool. |
| |
| Changes to this file may cause incorrect behavior and will be lost if |
| the code is regenerated. |
\* --------------------------------------------------------------------- */
Or you can provide your own string as the first parameter:
var gulp = require('gulp'),
notice = require('gulp-notice');
var text = '/* this file was auto-generated */';
gulp.task('default', function () {
gulp.src('src/*.js')
.pipe(notice(text))
.pipe(gulp.dest('dist/'));
});
Which will prepend files with:
/* this file was auto-generated */
Working wth streams
If you're working with streams (e.g. vinyl-source-stream) then gulp-streamify will help you. Let's say you're using browserify with vinyl-source-stream, you can wrap gulp-notice with streamify and it'll work:
return b.bundle()
.pipe(source(entry))
.pipe(streamify(notice()))
.pipe(gulp.dest('./public/js'));
Install it
npm install gulp-notice
More links
GitHub: https://github.com/adamkdean/gulp-notice
NPM: https://www.npmjs.com/package/gulp-notice