Skip to content

kiranparajuli589/htmlmark

Repository files navigation

HtmlMark

HtmlMark Logo

A very lightweight Markdown Parser powered by Regex

🔑 Why HtmlMark?

  • no use of external dependencies
  • lexer: to produce markdown tokens
  • parser: to produce the HTML code from the lexer
  • code highlighting support
  • support for front matter

🌐 Demo

Checkout the features of the parser from this Live Demo.

🎠 Installation

npm i htmlmark

💠 Usage

import HtmlMark from 'htmlmark';

const opts = {
	indent: 4,
	highlightFn: (code, lang) => {
		// return the highlighted code
	},
	useLinkRefs: true
};

const htmlmark = new HtmlMark(opts);

htmlmark.tokenize("## Hello World"); // returns the tokens
htmlmark.parse("## Hello World"); // returns the HTML code

🎡 Options

Option Type Default Description
indent number 4 Number of spaces (or tabs) to use for indentation
tabSize number 4 Equivalent spaces for a single tab used
highlightFn function undefined Function to highlight the code
useLinkRefs boolean true Whether to use link references or not

🎢 APIs

  • tokenize(markdown: string): Token[]: Returns the lexer from the markdown string
  • parse(markdown: string): string: Returns the HTML code from the markdown string
  • getFrontMatter(markdown: string): FrontMatter{}: Returns the front matter from the markdown string

Lexer

The provided markdown string is scanned line by line and checked against various regex patterns to produce the accurate markdown tokens. A general token structure is as:

{
	"indent": 0,
	"level": 1,
	"raw": "# Heading One Text",
	"setext": false,
	"type": "heading",
	"value": "Heading One Text",
	"tokens": [{
		"raw": "Heading One Text",
		"type": "text",
		"value": "Heading One Text"
	}]
}

Front Matter

The front matter is the metadata of the markdown file. It is written in the YAML format and is separated from the markdown content by a line containing three hyphens ---. It must be placed at the top of the markdown file.

Example:

---
title: Hello World
date: 2021-01-01
author: John Doe
---

## Hello World
Lorem ipsum dollar sit amet

The above markdown file will produce the following front matter:

{
	"title": "Hello World",
	"date": "2021-01-01",
	"author": "John Doe"
}

💁 Contributing to HtmlMark

Contributions are always welcome, no matter how large or small. Before contributing, please read the code of conduct. You can also find the development guide here.

📝 License

GNU GENERAL PUBLIC LICENSE v3.0 © Kiran Parajuli