refactor: refactor LaTeX render support (#168)

.node-version

@@ -0,0 +1 @@
+v22.11.0

astro.config.ts

@@ -3,10 +3,10 @@ import sitemap from '@astrojs/sitemap'
 import swup from '@swup/astro'
 import { defineConfig } from 'astro/config'
 import robotsTxt from 'astro-robots-txt'
+import rehypeKatex from 'rehype-katex'
+import remarkMath from 'remark-math'
 import UnoCSS from 'unocss/astro'
 import { themeConfig } from './src/.config'
-import remarkMath from 'remark-math'
-import rehypeKatex from 'rehype-katex'
 
 // https://astro.build/config
 export default defineConfig({

package.json

@@ -26,7 +26,6 @@
     "astro-robots-txt": "^1.0.0",
     "astro-seo": "^0.8.4",
     "giscus": "^1.5.0",
-    "katex": "^0.16.11",
     "rehype-katex": "^7.0.1",
     "remark-math": "^6.0.0",
     "typescript": "~5.5.4",

src/components/LaTeX.astro

@@ -6,12 +6,12 @@ const { latex } = themeConfig
 const katex = latex.katex
 ---
 
-{katex && (
-  <>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.css" crossorigin="anonymous">
-    <script is:inline defer src="https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.js" crossorigin="anonymous"></script>
-    <script is:inline defer src="https://cdn.jsdelivr.net/npm/katex@latest/dist/contrib/auto-render.min.js" crossorigin="anonymous"
-        onload="renderMathInElement(document.body);"></script>
-  </>
-)}
-
+{
+  katex && (
+    <link
+      rel="stylesheet"
+      href="https://cdn.jsdelivr.net/npm/katex@latest/dist/katex.min.css"
+      crossorigin="anonymous"
+    />
+  )
+}

src/content/posts/latex.mdx

@@ -0,0 +1,34 @@
+---
+title: "Test LaTeX"
+pubDate: 2023-10-01
+categories: ["test"]
+description: "This is an article for testing LaTeX rendering."
+---
+
+# Test LaTeX
+
+This is a sample article containing LaTeX mathematical formulas.
+
+## Inline Formula
+
+This is an inline formula: $E = mc^2$, which represents the mass-energy equivalence.
+
+## Block Formula
+
+Below is a block formula:
+
+$$
+\int_{a}^{b} f(x) \, dx = F(b) - F(a)
+$$
+
+This formula represents the fundamental theorem of calculus.
+
+## Complex Formula
+
+We can also display more complex formulas:
+
+$$
+\frac{d}{dx} \left( \int_{a}^{x} f(t) \, dt \right) = f(x)
+$$
+
+This formula represents the fundamental theorem of calculus in differential form.