Compiles Pug/Jade templates to Hyperscript.
gulp-pug-hyperscript is a gulp plugin to compile Pug/Jade templates to Hyperscript. Usable with maquette, virtual-dom, react, or any other DOM library that supports Hyperscript.
This package was created by smashing gulp-iced-coffee and virtual-jade-loader together until they fit. It uses virtual-jade to compile from Pug/Jade to Hyperscript.
npm install --save-dev gulp-pug-hyperscriptvar pugHyperscript = require('gulp-pug-hyperscript');
gulp.task('pug', function() {
gulp.src('./src/views/*.pug')
.pipe(pugHyperscript().on('error', gutil.log))
.pipe(gulp.dest('./public/'))
});gulp-pug-hyperscript will emit an error for cases such as invalid pug syntax. If uncaught, the error will crash gulp.
You will need to attach a listener (i.e. .on('error')) for the error event emitted by gulp-pug-hyperscript:
var pugStream = pugHyperscript({pretty: false});
// Attach listener
pugStream.on('error', function(err) {});In addition, you may utilize gulp-util's logging function:
var gutil = require('gulp-util');
// ...
var pugStream = pugHyperscript();
// Attach listener
pugStream.on('error', gutil.log);Since .on(...) returns this, you can compact it as inline code:
gulp.src('./src/views/*.pug')
.pipe(pugHyperscript().on('error', gutil.log))
// ...The options object supports the same options as virtual-jade, with three additional options:
silent: true
runtime: vjade.runtime
class: false
marshallDataset: truesilent: false will dump the pre- and post-processed template to the console for debugging.
vjade.runtime defaults to var h = require('virtual-dom/h');. To use Maquette or another Hyperscript library, replace vjade.runtime string with the appropriate string of code.
class replaces className attribute with the regular class attribute. This is necessary for Maquette and some other renderers.
marshallDataset, when false, will prevent virtual-jade from turning data- * attributes into a dataset Object. This is necessary for Maquette and some other renderers.
MIT