wrap marked-plus as a full-feature markdown renderer
npm install marked-plus-renderer --save
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>demo</title>
<link rel="stylesheet" href="$path/to/marked-plus-renderer/dist/libs.css">
</head>
<body>
<div id="container" class="markdown-body"></div>
<script src="$path/to/marked-plus-renderer/dist/libs.js"></script>
<script src="$path/to/marked-plus-renderer/dist/renderer.js"></script>
<script>
fetch('$path/to/marked-plus-renderer/doc/features.md').then(function(markdownString){
mpr.render(document.getElementById('container'), markdownString);
});
</script>
</body>
</html>
npm install marked-plus-renderer --save-dev
<!--...-->
<link rel="stylesheet" href="$path/to/marked-plus-renderer/dist/libs.css">
<!--...-->
<script src="$path/to/marked-plus-renderer/dist/libs.js"></script>
<script src="$path/to/main.js"></script>
<!--...-->
in main.js
import mpr from 'marked-plus-renderer';
// your codes
mpr.render(container, markdownString);
- all basic markdown features(headings, tables, etc.)
- gfm-like check-list
- code highlighting
- definition list
- footnote
- graph
- sequence diagram
- gantt diagram
- flowchart
- latex math typesetting
- emoji
- html/js/css injection