javascripthtmlmarkdown

Micromark conversion of markdwon text to html is converting html characters to html entities


I am using micromark to convert markdown text to html. It appears to be sanitizing html and I'm not sure how to disable it. For example this code:

import { micromark } from 'micromark';
import { gfm, gfmHtml } from 'micromark-extension-gfm';

const mdd = `
# Title
<div>
  This is HTML inside markdown.
  <img src="image.jpg" alt="Example image" />
</div>
`;
console.log(micromark(mdd, { extensions:[ gfm() ] }));

Results in this output

<h1>Title</h1>
&lt;div&gt;
  This is HTML inside markdown.
  &lt;img src=&quot;image.jpg&quot; alt=&quot;Example image&quot; /&gt;
&lt;/div&gt;

When I was hoping to get

<h1>Title</h1>
<div>
  This is HTML inside markdown.
  <img src="image.jpg" alt="Example image" />
</div>

Any tips on how I can make that work


Solution

  • Looks like adding allowDangerousHtml:true to your options should allow the html elements to get through unchanged.

    See the readme: https://github.com/micromark/micromark/blob/main/packages/micromark/readme.md#options

    import { micromark } from 'micromark';
    import { gfm, gfmHtml } from 'micromark-extension-gfm';
    
    const mdd = `
    # Title
    <div>
      This is HTML inside markdown.
      <img src="image.jpg" alt="Example image" />
    </div>
    `;
    console.log(micromark(mdd, { allowDangerousHtml:true, extensions:[ gfm() ] }));