fix(mathjax): move MathJax initialization to global scope

Updated MathJax initialization to be accessible globally by assigning it to the window object. This change ensures that MathJax is properly loaded and available for use across the application.

Additionally, added 'defer' attribute to script tags for correct loading order.

Author: geekifan

assets/js/mathjax.js

@@ -1,15 +1,13 @@
-document.addEventListener('DOMContentLoaded', () => {
-  MathJax = {
-    tex: {
-      inlineMath: [
-        ['$', '$'],
-      ['\\(', '\\)']
-      ],
-      displayMath: [
-        ['$$', '$$'],
-        ['\\[', '\\]']
-      ],
-      tags: 'ams'
-    }
-  };
-});
+window.MathJax = {
+  tex: {
+    inlineMath: [
+      ['$', '$'],
+    ['\\(', '\\)']
+    ],
+    displayMath: [
+      ['$$', '$$'],
+      ['\\[', '\\]']
+    ],
+    tags: 'ams'
+  }
+};

layouts/partials/js-selector.html

@@ -89,9 +89,9 @@
 {{ if .Params.math }}
   <!-- MathJax -->
   {{ $mathjaxConfig := resources.Get "js/mathjax.js" | minify | fingerprint }}
-  <script src="{{ $mathjaxConfig.RelPermalink }}"></script>
+  <script src="{{ $mathjaxConfig.RelPermalink }}" defer></script>
   <script async src="https://cdnjs.cloudflare.com/polyfill/v3/polyfill.min.js?features=es6"></script>
-  <script id="MathJax-script" async src="{{ $data.mathjax.js }}"></script>
+  <script id="MathJax-script" src="{{ $data.mathjax.js }}" defer></script>
 {{ end }}
 
 <!-- Pageviews -->