What is gulp-header?
The gulp-header npm package is a Gulp plugin that allows you to add headers to your files. This can be useful for adding comments, metadata, or any other text at the beginning of your files during the build process.
What are gulp-header's main functionalities?
Add a simple header
This feature allows you to add a simple header to your files. The example code adds a comment with the project name, version, and current date to the top of all JavaScript files in the 'src' directory and outputs them to the 'dist' directory.
const gulp = require('gulp');
const header = require('gulp-header');
const banner = '/* My Project - v1.0.0 - ' + new Date().toISOString() + ' */\n';
gulp.task('add-header', function() {
return gulp.src('src/*.js')
.pipe(header(banner))
.pipe(gulp.dest('dist'));
});
Add a header with dynamic content
This feature allows you to add a header with dynamic content using template strings. The example code uses data from the package.json file to create a header with the project name, version, description, and author.
const gulp = require('gulp');
const header = require('gulp-header');
const pkg = require('./package.json');
const banner = ['/**',
' * <%= pkg.name %> - <%= pkg.version %>',
' * <%= pkg.description %>',
' * (c) ' + new Date().getFullYear() + ' <%= pkg.author %>',
' */',
''].join('\n');
gulp.task('add-header', function() {
return gulp.src('src/*.js')
.pipe(header(banner, { pkg: pkg }))
.pipe(gulp.dest('dist'));
});
Other packages similar to gulp-header
gulp-footer
The gulp-footer package is similar to gulp-header but adds footers to files instead of headers. It can be used in conjunction with gulp-header to add both headers and footers to your files.
gulp-preprocess
The gulp-preprocess package allows you to preprocess files with directives and variables. While it is more general-purpose than gulp-header, it can be used to add headers to files as part of a larger preprocessing task.
gulp-insert
The gulp-insert package provides more general text insertion capabilities, allowing you to insert text at the beginning, end, or any position within a file. It can be used to add headers, but also offers more flexibility for other text manipulation tasks.
gulp-header is a Gulp extension to add a header to file(s) in the pipeline. Gulp is a streaming build system utilizing node.js.
Install
npm install --save-dev gulp-header
Usage
var header = require('gulp-header');
gulp.src('./foo/*.js')
.pipe(header('Hello'))
.pipe(gulp.dest('./dist/'))
gulp.src('./foo/*.js')
.pipe(header('Hello <%= name %>\n', { name : 'World'} ))
.pipe(gulp.dest('./dist/'))
gulp.src('./foo/*.js')
.pipe(header('Hello ${name}\n', { name : 'World'} ))
.pipe(gulp.dest('./dist/'))
var pkg = require('./package.json');
var banner = ['/**',
' * <%= pkg.name %> - <%= pkg.description %>',
' * @version v<%= pkg.version %>',
' * @link <%= pkg.homepage %>',
' * @license <%= pkg.license %>',
' */',
''].join('\n');
gulp.src('./foo/*.js')
.pipe(header(banner, { pkg : pkg } ))
.pipe(gulp.dest('./dist/'))
var fs = require('fs');
gulp.src('./foo/*.js')
.pipe(header(fs.readFileSync('header.txt', 'utf8'), { pkg : pkg } ))
.pipe(gulp.dest('./dist/'))
return gulp.src([
'src/*.coffee',
])
.pipe(header(banner, { pkg : pkg } ))
.pipe(sourcemaps.init())
.pipe(coffee({
bare: true
}))
.pipe(sourcemaps.write('.'))
.pipe(gulp.dest('dist/js'))
Issues and Alerts
My handle on twitter is @tracker1 - If there is an urgent issue, I get twitter notifications sent to my phone.
API
text
Type: String
Default: ''
The template text.
data
Type: Object
Default: {}
The data object used to populate the text.
In addition to the passed in data, file
will be the stream object for the file being templated against and filename
will be the path relative from the stream's basepath.
NOTE: using false
will disable template processing of the header