README

slimdown-js

A basic regex-based Markdown parser based on the gist by Johnny Broadway, converted from PHP to TypeScript, extended with several additional elements (images, tables, code blocks, underscores) and published to npm.

Inspired by:

Supports the following elements (and can be extended via Slimdown.add_rule(regexp: RegExp, replacement: string | Function)):

Headers
Images
Links
Bold
Emphasis
Deletions
Quotes
Inline code
Code blocks
Blockquotes
Tables
Underscores (_)
Ordered/unordered lists (one level deep only)

Size

The main reason for using this library, which hasn't been extensively tested and is not completely compatible with the spec, is to have something small. Version 0.1.0's size is 2.614 bytes, uncompressed, and 1.267 bytes using gzip compression.

For more advanced scenario's, however, I can recommend marked, albeit at a bigger size: marked.min.js is 23.372 bytes uncompressed, and 7.684 bytes using gzip.

Playground

Head over to flems.io for a live example.

Usage

Here is the general use case:

import { Slimdown } from 'slimdown-js';

console.log(
  Slimdown.render(
    '# Page title\n\nAnd **now** for something _completely_ different.',
  ),
);

Adding rules

A simple rule to convert :) to an image:

import { render, addRule } from 'slimdown-js';

addRule ('/(\W)\:\)(\W)/', '$1<img src="smiley.png" />$2');

console.log(render(('Know what I\'m sayin? :)'));

In this example, we add GitHub-style internal linking (e.g., [[Another Page]]).

import { render, addRule } from 'slimdown-js';

const mywiki_internal_link = (title: string) =>
  `<a href="${title.replace(/[^a-zA-Z0-9_-]+/g, '_')}">${title}</a>`;

addRule('/[[(.*?)]]/e', mywiki_internal_link('$1'));

console.log(render('Check [[This Page]] out!'));

A longer example

import { render } from 'slimdown-js';

console.log(render(`# A longer example

And *now* [a link](http://www.google.com) to **follow** and [another](http://yahoo.com/).

* One
* Two
* Three

## Subhead

One **two** three **four** five.

One __two__ three _four_ five __six__ seven _eight_.

1. One
2. Two
3. Three

More text with `inline($code)` sample.

> A block quote
> across two lines.

More text...`));

Usage no npm install needed!