{
  displayMode: true,
  throwOnError: false, //allows katex to fail silently
  errorColor: '#ff0000',
  delimiters: [
    { left: "$$", right: "$$", display: true }, // katex default
    { left: "\\[", right: "\\]", display: true }, // katex default
    { left: "\\(", right: "\\)", display: false }, // katex default
    { left: '~', right: '~', display: false, asciimath: true },
    { left: '&&', right: '&&', display: true, asciimath: true },
  ],
}

Examples:

<script>
  const converter = new showdown.Converter({
    extensions: [
      showdownKatex({
        // maybe you want katex to throwOnError
        throwOnError: true,
        // disable displayMode
        displayMode: false,
        // change errorColor to blue
        errorColor: '#1500ff',
      }),
    ],
  });
  converter.makeHtml('~x=2~');
</script>

Check katex for more details.

FOUC

If your page suffers from a "Flash Of Unstyled Content," add this to your <body> tag:

<body  style="display:none;" onload="$('body').show();">

This hides the body and shows it only when the JavaScript has loaded.

Math Example

in asciimath

&& x = (-b+-sqrt(b^2-4ac))/(2a) &&

&& x = (-b+-sqrt(b^2-4ac))/(2a) &&

in latex

$$ x=\frac{ -b\pm\sqrt{ b^2-4ac } } {2a} $$

$$ x=\frac{ -b\pm\sqrt{ b^2-4ac } } {2a} $$

They will both render the exact same thing. If the examples don't render correctly click here.

Keywords

FAQs

What is @coding-blocks/showdown-katex?

Is @coding-blocks/showdown-katex well maintained?

Package last updated on 03 Jan 2019

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

@coding-blocks/showdown-katex

showdown-katex

Config

FOUC

Math Example

Keywords

Related posts

Create React App Officially Deprecated Amid React 19 Compatibility Issues

Oracle Drags Its Feet in the JavaScript Trademark Dispute