Marked-plus-renderer NPM

marked-plus-renderer

wrap marked-plus as a full-feature markdown renderer

install

npm install marked-plus-renderer --save

usage

sample

<!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>

use with npm

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);

demo

features

features

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

markdown markdown renderer marked marked-plus marked-plus-renderer

emoji-map flowchart.js github-markdown-css highlight.js katex-all marked-plus mermaid raphael zero-dom zero-fmt zero-lang zero-text

@everything-registry/sub-chunk-2133 zfinder-mw-markdown @zalastax/nolb-marke

8 years ago

8 years ago

8 years ago

8 years ago

8 years ago