Skip to content

acmenlei/markdown-plus

Repository files navigation

markdown-transform-html

markdown-transform-html typescript

 

Introduce

Markdown converter, convert Markdwon content to HTML format, and provide code line number display and code highlighting effect (currently support javascript, HTML and other languages, later will support C, C++, Java, JS, TS, Ruby, Rust, PHP, GO, ...).

The online demo

Prompt

To make the style apply only to the part that needs to be parsed, be sure to add a 'markdown-transform-html' class declaration to the parsed container.

Use

install

pnpm install markdown-transform-html

or

npm install markdown-transform-html

or

yarn add markdown-transform-html

Example

import { markdownToHTML } from "markdown-transform-html"
import  "markdown-transform-html/lib/styles/index.css";

const markdownContent = `#### level 4`;
const html = markdownToHTML(markdownContent);
(document.querySelector("#app") as Element).innerHTML = html;

Highlighting

If you want to highlight code, then you need to introduce the following css styles and configure options, which is optional.

markdownToHTML(markdownContent, { highlight: true });

MarkdownToHTML Options

Configure the markdownToHTML options

property name type default value meaning
lineNumber Boolean false If you need line numbers, turn this option on
highlight Boolean false If you need to highlight code in markdown, turn this option on
xss Boolean true To prevent users from xss attacks on your application, xss is used by default. If you want to turn it off, you can set it to false

Problems

Q: Why does highlighting fail after code changes?

A: After the content has been modified you should re-highlight the code using the reHighlight method

// example
import { reHighlight } from "markdown-transform-html"
reHighlight();

Sponsorship

If you think this project is helpful to you and circumstances permit, you can give me a little support. In short, thank you very much for your support ~

WeChat

 wechat

Alipay

 alipay

License

MIT © coderlei