hyperpug

Pug for browser, based on Hyperscript

Usage no npm install needed!

<script type="module">
  import hyperpug from 'https://cdn.skypack.dev/hyperpug';
</script>

README

HyperPug

npm version Website shields.io

Lighter Pug for browser/Electron. With Pug filters' support.

Usage

import HyperPug from 'hyperpug'
const hp = new HyperPug()

console.log(hp.parse(HYPERPUG_STRING))

Usage with filters

Filters are normalized for Markdown and other indented languages are well.

import HyperPug from 'hyperpug'
const hp = new HyperPug({
  markdown: (s) => {
    return markdownMaker(s)
  }
})

console.log(hp.parse(HYPERPUG_STRING))

Usage on the browser

<div id="hyperpug"></div>
<script src="https://unpkg.com/hyperpug"></script>
<script>
const hp = new HyperPug({
  markdown: (s) => {
    return markdownMaker(s)
  }
})

document.getElementById("hyperpug").innerHTML = hp.parse(`
style.
  .red {
    color: red;
  }

  section {
    margin-bottom: 1rem;
  }

section(class="x")
  div hello
  blockquote
    .red goodbye
  :markdown
    # This is some heading
br
small Yes, this is a good idea.
`)
</script>