title: How to use MathJax in a svelte project?
body: <p>I am working on a svelte text editor project in svelte , the code is very simple (<a href="https://svelte.dev/repl/6b1585a60c8248a78248d820a37093c2?version=3.32.3" rel="nofollow noreferrer">REPL</a>) :</p>
  <pre class="lang-html prettyprint-override"><code>&lt;script&gt;
      let rawText
      let formatText = (text)=&gt;{
          // Text Formating
          return text
      }
      $: formatedText = formatText(rawText)
  &lt;/script&gt;
  
  &lt;textarea bind:value={rawText}&gt;&lt;/textarea&gt;
  {#if formatedText}
      {formatedText}
  {/if}
  </code></pre>
  <p>I need to be able to write math equations.</p>
  <p>To do so I have found MathJax but I can't find a clean way to import it into my svelte app</p>
  <p>I have tried  multiples approach like</p>
  <h2>the npm way :</h2>
  <p>using :</p>
  <pre><code>npm i mathjax
  </code></pre>
  <p>and on the svelte component :</p>
  <pre class="lang-js prettyprint-override"><code>import MathJax from 'mathjax'
  </code></pre>
  <p>But when I do this the app turn white without any error</p>
  <h2>The svelte:head way :</h2>
  <p>The second solution I tried was to import MathJax from a cdn in a script tag like that :</p>
  <pre class="lang-html prettyprint-override"><code>&lt;svelte:head&gt;
      &lt;script src=&quot;https://polyfill.io/v3/polyfill.min.js?features=es6&quot;&gt;&lt;/script&gt;
      &lt;script
          id=&quot;MathJax-script&quot;
          async
          src=&quot;https://cdn.jsdelivr.net/npm/mathjax@3/es5/tex-svg.js&quot;&gt;&lt;/script&gt;
  &lt;/svelte:head&gt;
  </code></pre>
  <p>And it kinda works because I can access MathJax functions in the browser console but I don't know to use them in my svelte app</p>
  <p><a href="https://i.stack.imgur.com/gWa1Z.png" rel="nofollow noreferrer">capture</a></p>
  <h2>The hacky way :</h2>
  <p>The last solution I have found <a href="https://svelte.dev/repl/ebd12dbf04574b2bb40003cc8a4299b0?version=3.14.1" rel="nofollow noreferrer">in this example</a> leads to the same problem.</p>
  <p>So my question is how to import mathjax in my svelte project or can I use something else?</p>