Skip to main content

Convert Markdown to HTML , Mathjax and Prism.js are supported.

Works with
This package works with Bun
It is unknown whether this package works with Cloudflare Workers
This package works with Node.js
This package works with Deno
This package works with Browsers
JSR Score
100%
Published
a week ago (0.2.5)

mm-mark

ESM Only

md-html


Convert Markdown to HTML

Mmmark : Convert Md to Html with my own Prism.js code highlight and Mathjax extenstions of Showdown.Js.

Note

This package focus on convert markdown to html . If you want more, recommended to use Showdown.js


Main dependencies bundled license information.

1. Showdown.js

Showdown.js is a powerful JavaScript library used for converting Markdown into HTML. It's a key dependency in our project, providing the core functionality of our Markdown to HTML conversion.

2. JS-YAML

JS-YAML is a JavaScript implementation of YAML, a human-friendly data serialization standard. In our project, it's used for parsing YAML front matter in Markdown files.

3. Other dependencies

  • Prism.Js for code block highlight.
  • Mathjax for math support.
  • tsup for typescript compile and bundle.

npm version

Install from npm

npm i mm-mark
yarn add mm-mark
pnpm i mm-mark

JSR

Install from jsr.io

deno

deno add @ptm/mm-mark

npm

npx jsr add @ptm/mm-mark

yarn

yarn dlx jsr add @ptm/mm-mark

pnpm

pnpm dlx jsr add @ptm/mm-mark

bun

bunx jsr add @ptm/mm-mark

Import

import * as mod from "@ptm/mm-mark";

Documentations

1. Mmmark.renderHtml

1.1 Descriptions

Renders the given text as HTML using the Showdown library.

1.2 Options

1.2.1 text: string | Markdown Contents.
1.2.2 RenderOptions
1.2.2.1 theme: string | oiptional | default - "vs"

Name of Prism.js themes for code block highlight.

Available Themes
actom-dark
cb
coldark-dark
dark
holi-theme
duotone-earth
duotone-forest
duotone-light
duotone-sea
duotone-space
funky
ghcolors
gruvbox-light
laserwave
lucario
night-owl
okaidia
one-dark
one-light
solarized-dark-atom
synthwave84
tomorrow
twilight
vs
vsc-dark-plus
z-touch
1.2.2.2 languages?: string [ ] | optional | default - See below.

Prism Js supported languages , its perform prismjs loadLanguages() ,prismjs will load the default languages: markup, css, clike and javascript and Mmmark will preload others additional languages are as follows. Do not use with Webpack or another bundler, as this will cause Webpack to include all languages and plugins.

Preloaded Languages
python
py
typescript
ts
yaml
yml
toml
sass
scss
rust
ruby
rb
jsx
tsx
php
markdown
md
latex
tex
haskell
hs
json
asciidoc
adoc
bash
shell
c
csharp
cs
dotnet
cpp
java
1.2.3 metadata: boolean | optional | fefault - false

If you used metadata (as follows) , set it true.

---
title: Hello World
date: 2023-04-12
---

1.3 Return

1.3.1 HTML: string | The rendered HTML string

1.4 Example

import Mmmark from "mm-mark";
const md = "# Hello World";
// convert to markdown to html
const converter = Mmmark.renderHtml(Options);

console.log(html);

/* 
-- others outputs that provided by Mmmark.

  <h1 id="hello-world">Hello World</h1>

-- others outputs that provided by Mmmark.
*/

2. Mmmark.getFrontmatter

2.1 Descriptions

Generates data and content from the markdown file.

2.2 Options

2.2.1 text: string | Markdown content

2.3 Return

2.3.1 data: Record<string, unknown> | YAML front matter in Markdown files.
2.3.2 content: string | Raw markdown content.

2.4 Example

example.md

---
title: Hello World
date: 2023-04-12
---

# Hello World!
import Mmmark from "mm-mark";
import fs from "fs";

const md = fs.readFileSync("example.md", "utf-8");

const data = Mmmark.getFrontmatter(md).data
const content = Mmmark.getFrontmatter(md).content

Add Package

deno add @ptm/mm-mark

Import symbol

import * as mod from "@ptm/mm-mark";

Add Package

npx jsr add @ptm/mm-mark

Import symbol

import * as mod from "@ptm/mm-mark";

Add Package

yarn dlx jsr add @ptm/mm-mark

Import symbol

import * as mod from "@ptm/mm-mark";

Add Package

pnpm dlx jsr add @ptm/mm-mark

Import symbol

import * as mod from "@ptm/mm-mark";

Add Package

bunx jsr add @ptm/mm-mark

Import symbol

import * as mod from "@ptm/mm-mark";