npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

gulp-pug-hyperscript

v1.0.3

Published

Compile Pug/Jade files into Hyperscript

Downloads

4

Readme

gulp-pug-hyperscript

Build Status Coverage Status Dependency Status devDependency Status Downloads

Compiles Pug/Jade templates to Hyperscript.

NPM

About

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.

Installation

npm install --save-dev gulp-pug-hyperscript

Usage

var pugHyperscript = require('gulp-pug-hyperscript');

gulp.task('pug', function() {
  gulp.src('./src/views/*.pug')
    .pipe(pugHyperscript().on('error', gutil.log))
    .pipe(gulp.dest('./public/'))
});

Error handling

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))
  // ...

Options

The options object supports the same options as virtual-jade, with three additional options:

  silent:   true
  runtime:  vjade.runtime
  class:    false
  marshallDataset: true

silent: 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.

License

MIT