module.html 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243
  1. <!DOCTYPE html>
  2. <!--To test ECMA modules, run `npm run build` and then `npm start`
  3. in the root KaTeX directory and then visit with a web browser
  4. which supports modules: http://localhost:7936/module.html
  5. -->
  6. <html>
  7. <head>
  8. <meta charset="UTF-8">
  9. <title>KaTeX Test</title>
  10. <link rel="stylesheet" type="text/css" href="/dist/katex.css">
  11. <link rel="stylesheet" type="text/css" href="/main.css">
  12. <script type="module" type="text/javascript">
  13. import katex from '/dist/katex.mjs';
  14. const input = document.getElementById("input");
  15. const math = document.getElementById("math");
  16. input.addEventListener("input", reprocess, false);
  17. reprocess();
  18. function reprocess() {
  19. try {
  20. katex.render(input.value, math, {displayMode: true, throwOnError: false, macros: {}});
  21. } catch (e) {
  22. if (e.__proto__ === katex.ParseError.prototype) {
  23. console.error(e);
  24. } else {
  25. throw e;
  26. }
  27. }
  28. }
  29. </script>
  30. </head>
  31. <body>
  32. <textarea id="input" rows="5">
  33. \left( x \right) \left( x^2 \right) % comment
  34. \left( \frac{a}{b} \right) \left( \frac{a^2}{b} \right)
  35. \left( \dfrac{a}{b} \right) \left( \dfrac{a^2}{b} \right)
  36. </textarea>
  37. <div id="math"></div>
  38. </body>
  39. </html>