https://github.com/patarapolw/hyperpug

Lightweight Pug for browser/Electron. With Pug filters' support, which can also contain indented language like markdown.
https://github.com/patarapolw/hyperpug

markdown pugjs

Last synced: about 1 month ago
JSON representation

Lightweight Pug for browser/Electron. With Pug filters' support, which can also contain indented language like markdown.

• Host: GitHub
• URL: https://github.com/patarapolw/hyperpug
• Owner: patarapolw
• License: mit
• Created: 2019-08-16T15:28:23.000Z (over 5 years ago)
• Default Branch: master
• Last Pushed: 2023-01-06T02:25:11.000Z (almost 2 years ago)
• Last Synced: 2024-09-27T08:40:35.209Z (about 2 months ago)
• Topics: markdown, pugjs
• Language: TypeScript
• Homepage: https://hyperpug.netlify.app
• Size: 1.34 MB
• Stars: 13
• Watchers: 1
• Forks: 1
• Open Issues: 11
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# HyperPug

[![npm version](https://badge.fury.io/js/hyperpug.svg)](https://badge.fury.io/js/hyperpug) [![Website shields.io](https://img.shields.io/website-up-down-green-red/https/hyperpug.netlify.app.svg)](https://hyperpug.netlify.app/)

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

## Usage

```typescript

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.

```typescript

import HyperPug from 'hyperpug'

const hp = new HyperPug({

  markdown: (s) => {

    return markdownMaker(s)

  }

})

console.log(hp.parse(HYPERPUG_STRING))

```

## Usage on the browser

```html



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

small Yes, this is a good idea.

`)

```