@coding-blocks/showdown-katex
Advanced tools
showdown extension that adds latex and asciimath support thru katex
npm install showdown-katex
Showdown extension to render LaTeX math and AsciiMath using KaTeX;
Special characters do not need escaping
Works well alongside bootmark
You can customize what gets passed to the katex renderer by passing a config object.
These are the defaults:
{
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.
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.
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.
FAQs
showdown extension that adds latex and asciimath support thru katex
The npm package @coding-blocks/showdown-katex receives a total of 1 weekly downloads. As such, @coding-blocks/showdown-katex popularity was classified as not popular.
We found that @coding-blocks/showdown-katex demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 6 open source maintainers collaborating on the project.
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.
Research
Malicious Namastex.ai npm packages appear to replicate TeamPCP-style Canister Worm tradecraft, including exfiltration and self-propagation.
Product
Explore exportable charts for vulnerabilities, dependencies, and usage with Reports, Socket’s new extensible reporting framework.
Product
Socket for Jira lets teams turn alerts into Jira tickets with manual creation, automated ticketing rules, and two-way sync.