After trying out several Markdown parsers and realizing that the results were quite different at times, I decided to write my own parser from scratch.
The project can be viewed on GitHub and is pretty easy to integrate.
<!DOCTYPE html> <html lang="de"> <head> <meta charset="UTF-8"> <title>Document</title> <link rel="stylesheet" href="https://frankwisniewski.github.io/mdparser/mini.css"> <script src="https://frankwisniewski.github.io/mdparser/mdparsershortmin.js"></script> <script type="module"> import mermaid from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs'; mermaid.initialize({ startOnLoad: true }); </script> <script> MathJax = { tex: { inlineMath: [['-$', '$-'], ['\\(', '\\)']] }, svg: { fontCache: 'global' } }; </script> <script id="MathJax-script" async src="https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js"> </script> </head> <body> <div class=container id="markdownContainer"></div> <script> "use strict"; async function loadMD(fileName){ try { const req = await fetch( fileName , { method: 'get', headers: { 'content-type': 'text/csv;charset=UTF-8' } }); if (req.status === 200){ let markDown = await req.text() return markDown } } catch (err) {console.log(err)} } function process(md){ let mdToHtm = fhwMD( md, {autoid:true, mathjax:true} ) markdownContainer.innerHTML=mdToHtm; } loadMD("https://corsproxy.io?https://frankwisniewski.github.io/mdparser/beschreibung.md").then( (markdown) => process(markdown)) </script> </body> </html> The function call is as follows: fhwMD( md, {autoid:true, mathjax:true} )
The minified JavaScript code is just under 14 kilobytes in size.
Top comments (0)