Gulp plugin for the layouts lib, which provides a simple way of using common code or content to wrap other files. Can be used with HTML, javascript, banners, CSS, or any other string.
Install with npm:
$ npm install --save gulp-layoutsA layout is a template that is used to "wrap" other files with common content or code.
Example
Given you have a layout, default.txt with the following contents:
foo
{% body %}
bar
If you specify the name of the layout on the file.layout property, like so:
var File = require('vinyl');
var file = new File({path: 'foo/bar.txt', contents: new Buffer('This is contents')});
file.layout = 'default.txt';Then pass the layout to the layouts() plugin:
var layout = new File({path: 'default.txt', contents: new Buffer('foo\n{% body %}\nbar')});
gulp.task('default', function() {
return gulp.src('test/fixtures/alpha.txt')
.pipe(layouts({files: {'default.txt': layout}}))
.pipe(gulp.dest('test/actual'));
});Results in:
foo
This is contents
bar
Visit layouts for more examples. The unit tests are really helpful as well.
Pass an object of vinyl files on options.files for the plugin to use as "layouts":
- the contents of each file must have a
{% body %}tag. See the layouts docs if you need to customize this. - layouts can specify other layouts
- a default layout can be specified on
options.defaultLayout
Given you have a javascript file, index.js, with the following contents:
module.exports = function() {
};Define layouts
and this banner, in banner.js:
/*!
* <%= name %> <<%= homepage %>>
*
* Copyright (c) <%= year %>, <%= author %>.
* Licensed under the MIT License.
*/You can easily create a layout to apply banners to any files:
var fs = require('fs');
var gulp = require('gulp');
var layouts = require('gulp-layouts');
var files = {banner: {contents: fs.readFileSync('banner.js')}};
var data = require('./package');
data.year = new Date().getFullYear();
gulp.task('default', function() {
return gulp.src('test/fixtures/alpha.txt')
.pipe(layouts({files: files, defaultLayout: 'banner'}))
.pipe(template(data))
.pipe(gulp.dest('test/actual'));
});Results in something like:
/*!
* your-package <https://github.com/foo/your-package>
*
* Copyright (c) 2016, Santa Claus.
* Licensed under the MIT License.
*/
module.exports = function() {
};Given you have a file, alpha.txt, with the following contents:
This is the alpha file!
Define layouts
var gulp = require('gulp');
var layouts = require('gulp-layouts');
var files = {
aaa: {contents: new Buffer('aaa before\n{% body %}\naaa after'), layout: 'bbb'},
bbb: {contents: new Buffer('bbb before\n{% body %}\nbbb after'), layout: 'ccc'},
ccc: {contents: new Buffer('ccc before\n{% body %}\nccc after')},
};
gulp.task('default', function() {
return gulp.src('test/fixtures/alpha.txt')
.pipe(layouts({files: files}))
.pipe(gulp.dest('test/actual'));
});Results in:
The contents of alpha.txt is updated to:
ccc before
bbb before
aaa before
This is the alpha file!
aaa after
bbb after
ccc after
Pull requests and stars are always welcome. For bugs and feature requests, please create an issue.
(This document was generated by verb-generate-readme (a verb generator), please don't edit the readme directly. Any changes to the readme must be made in .verb.md.)
To generate the readme and API documentation with verb:
$ npm install -g verb verb-generate-readme && verbInstall dev dependencies:
$ npm install -d && npm testJon Schlinkert
Copyright © 2016, Jon Schlinkert. Released under the MIT license.
This file was generated by verb, v0.9.0, on July 25, 2016.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent