Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Mermaid.js in a script file for Blazor

$
0
0

I have a Markdown Editor component for Blazor. In this component, I use an old version of Mermaid to display graphs.

I added the Mermaid library using this script

<script src="https://cdn.jsdelivr.net/npm/mermaid/dist/mermaid.min.js"></script>

Unfortunately, this version raises an error

e.replace is not a function

So, I tried to replace this script with

<script type="module">    import mermaid         from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';    mermaid.initialize({ startOnLoad: true });</script>

In this case, I don't have an error but the graph is not rendered because when I check if

if (typeof mermaid !== 'undefined') {    // code}

is always false. So, I tried to add the code abode in the JavaScript script like

import { mermaid }     from 'https://cdn.jsdelivr.net/npm/mermaid@10/dist/mermaid.esm.min.mjs';mermaid.initialize({    startOnLoad: true});// rest of the script

but in this case, the error is

Unhandled exception rendering component: Could not find 'initialize' ('initialize' was undefined).

Error: Could not find 'initialize' ('initialize' was undefined).

So, my questions are:

  • how can I add the import in my script and call the initialize function
  • how can I check if mermaid is available

Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>