diff --git a/astro.config.mjs b/astro.config.mjs index 7994cb6..16b6adb 100644 --- a/astro.config.mjs +++ b/astro.config.mjs @@ -4,6 +4,8 @@ import mdx from '@astrojs/mdx'; import vue from '@astrojs/vue'; import tailwind from '@astrojs/tailwind'; import react from '@astrojs/react'; +import remarkMath from 'remark-math'; +import rehypeKatex from 'rehype-katex'; // https://astro.build/config export default defineConfig({ @@ -24,6 +26,8 @@ export default defineConfig({ theme: 'github-dark', wrap: true, }, + remarkPlugins: [remarkMath], + rehypePlugins: [rehypeKatex], }, vite: { ssr: { diff --git a/docs/user-guide.md b/docs/user-guide.md index 50457a3..a260a8c 100644 --- a/docs/user-guide.md +++ b/docs/user-guide.md @@ -296,6 +296,61 @@ import TypewriterText from '../components/react/TypewriterText'; - `loop`：是否循环播放（可选，默认为 false） - `style`：自定义样式（可选） +#### MathFlipCard 数学公式翻转卡片 + +一个专门用于展示 LaTeX 数学公式的翻转卡片组件。正面显示渲染后的公式，背面显示 LaTeX 源码。 + +```mdx +import MathFlipCard from '../components/react/MathFlipCard'; + + +``` + +**属性说明**： +- `latex`：LaTeX 公式字符串 +- `displayMode`：是否为块级公式（可选，默认为 true） +- `className`：自定义 CSS 类名（可选） + +**示例**： + +```mdx +--- +title: 数学公式展示 +description: 使用翻转卡片展示数学公式 +pubDate: 2024-01-20 +tags: [数学, LaTeX] +--- + +import MathFlipCard from '../components/react/MathFlipCard'; + +# 数学公式展示 + +## 质能方程 + + + +## 麦克斯韦方程组 + + + +## 薛定谔方程 + + + +## 矩阵运算 + + +``` + +**特点**： +- 点击"显示 LaTeX"按钮可查看公式源码 +- 点击"显示公式"按钮返回渲染结果 +- 支持 KaTeX 的所有语法 +- 适合教学和技术文档 + ### 在文章中使用 在 MDX 文章中导入并使用这些组件： diff --git a/package-lock.json b/package-lock.json index 4d1d345..b6e961d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,13 +12,14 @@ "@astrojs/react": "^4.4.2", "@astrojs/tailwind": "^5.1.5", "@astrojs/vue": "^5.1.4", - "@myriaddreamin/typst-ts-renderer": "^0.7.0-rc2", - "@myriaddreamin/typst.ts": "^0.7.0-rc2", "@tailwindcss/typography": "^0.5.19", "astro": "^5.17.1", + "katex": "^0.16.33", "marked": "^17.0.3", "react": "^19.2.4", "react-dom": "^19.2.4", + "rehype-katex": "^7.0.1", + "remark-math": "^6.0.0", "tailwindcss": "^3.4.0", "vue": "^3.5.29" } @@ -1642,33 +1643,6 @@ "url": "https://opencollective.com/unified" } }, - "node_modules/@myriaddreamin/typst-ts-renderer": { - "version": "0.7.0-rc2", - "resolved": "https://registry.npmjs.org/@myriaddreamin/typst-ts-renderer/-/typst-ts-renderer-0.7.0-rc2.tgz", - "integrity": "sha512-god1tcb2YJDkQfA8gLGcAmykVGBpNKorqqDkXVy3InC18KRbsverJhlrHoONurNIU9JuIHoWjJ2D1ntpjPgzbA==", - "license": "Apache-2.0" - }, - "node_modules/@myriaddreamin/typst.ts": { - "version": "0.7.0-rc2", - "resolved": "https://registry.npmjs.org/@myriaddreamin/typst.ts/-/typst.ts-0.7.0-rc2.tgz", - "integrity": "sha512-VM8JqsRcL3AEJ5cuPBn/YvnGTXK/BRPlxdGB2bR48Of/8OIGaPiunv2QfZBIMBBrtbTygUOtAY9BZvkS1AFqgA==", - "license": "Apache-2.0", - "dependencies": { - "idb": "^7.1.1" - }, - "peerDependencies": { - "@myriaddreamin/typst-ts-renderer": "^0.7.0-rc2", - "@myriaddreamin/typst-ts-web-compiler": "^0.7.0-rc2" - }, - "peerDependenciesMeta": { - "@myriaddreamin/typst-ts-renderer": { - "optional": true - }, - "@myriaddreamin/typst-ts-web-compiler": { - "optional": true - } - } - }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -2246,6 +2220,12 @@ "@types/unist": "*" } }, + "node_modules/@types/katex": { + "version": "0.16.8", + "resolved": "https://registry.npmjs.org/@types/katex/-/katex-0.16.8.tgz", + "integrity": "sha512-trgaNyfU+Xh2Tc+ABIb44a5AYUpicB3uwirOioeOkNPPbmgRNtcWyDeeFRzjPZENO9Vq8gvVqfhaaXWLlevVwg==", + "license": "MIT" + }, "node_modules/@types/mdast": { "version": "4.0.4", "resolved": "https://registry.npmjs.org/@types/mdast/-/mdast-4.0.4.tgz", @@ -4140,6 +4120,21 @@ "node": ">= 0.4" } }, + "node_modules/hast-util-from-dom": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/hast-util-from-dom/-/hast-util-from-dom-5.0.1.tgz", + "integrity": "sha512-N+LqofjR2zuzTjCPzyDUdSshy4Ma6li7p/c3pA78uTwzFgENbgbUrm2ugwsOdcjI1muO+o6Dgzp9p8WHtn/39Q==", + "license": "ISC", + "dependencies": { + "@types/hast": "^3.0.0", + "hastscript": "^9.0.0", + "web-namespaces": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/hast-util-from-html": { "version": "2.0.3", "resolved": "https://registry.npmjs.org/hast-util-from-html/-/hast-util-from-html-2.0.3.tgz", @@ -4158,6 +4153,22 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/hast-util-from-html-isomorphic": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/hast-util-from-html-isomorphic/-/hast-util-from-html-isomorphic-2.0.0.tgz", + "integrity": "sha512-zJfpXq44yff2hmE0XmwEOzdWin5xwH+QIhMLOScpX91e/NSGPsAzNCvLQDIEPyO2TXi+lBmU6hjLIhV8MwP2kw==", + "license": "MIT", + "dependencies": { + "@types/hast": "^3.0.0", + "hast-util-from-dom": "^5.0.0", + "hast-util-from-html": "^2.0.0", + "unist-util-remove-position": "^5.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/hast-util-from-parse5": { "version": "8.0.3", "resolved": "https://registry.npmjs.org/hast-util-from-parse5/-/hast-util-from-parse5-8.0.3.tgz", @@ -4409,12 +4420,6 @@ "node": ">=18.18.0" } }, - "node_modules/idb": { - "version": "7.1.1", - "resolved": "https://registry.npmjs.org/idb/-/idb-7.1.1.tgz", - "integrity": "sha512-gchesWBzyvGHRO9W8tzUWFDycow5gwjvFKfyV9FF32Y7F50yZMp7mP+T2mJIWFx49zicqyC4uefHM17o6xKIVQ==", - "license": "ISC" - }, "node_modules/import-meta-resolve": { "version": "4.2.0", "resolved": "https://registry.npmjs.org/import-meta-resolve/-/import-meta-resolve-4.2.0.tgz", @@ -4715,6 +4720,31 @@ "graceful-fs": "^4.1.6" } }, + "node_modules/katex": { + "version": "0.16.33", + "resolved": "https://registry.npmjs.org/katex/-/katex-0.16.33.tgz", + "integrity": "sha512-q3N5u+1sY9Bu7T4nlXoiRBXWfwSefNGoKeOwekV+gw0cAXQlz2Ww6BLcmBxVDeXBMUDQv6fK5bcNaJLxob3ZQA==", + "funding": [ + "https://opencollective.com/katex", + "https://github.com/sponsors/katex" + ], + "license": "MIT", + "dependencies": { + "commander": "^8.3.0" + }, + "bin": { + "katex": "cli.js" + } + }, + "node_modules/katex/node_modules/commander": { + "version": "8.3.0", + "resolved": "https://registry.npmjs.org/commander/-/commander-8.3.0.tgz", + "integrity": "sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==", + "license": "MIT", + "engines": { + "node": ">= 12" + } + }, "node_modules/kleur": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/kleur/-/kleur-3.0.3.tgz", @@ -4977,6 +5007,25 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/mdast-util-math": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/mdast-util-math/-/mdast-util-math-3.0.0.tgz", + "integrity": "sha512-Tl9GBNeG/AhJnQM221bJR2HPvLOSnLE/T9cJI9tlc6zwQk2nPk/4f0cHkOdEixQPC/j8UtKDdITswvLAy1OZ1w==", + "license": "MIT", + "dependencies": { + "@types/hast": "^3.0.0", + "@types/mdast": "^4.0.0", + "devlop": "^1.0.0", + "longest-streak": "^3.0.0", + "mdast-util-from-markdown": "^2.0.0", + "mdast-util-to-markdown": "^2.1.0", + "unist-util-remove-position": "^5.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/mdast-util-mdx": { "version": "3.0.0", "resolved": "https://registry.npmjs.org/mdast-util-mdx/-/mdast-util-mdx-3.0.0.tgz", @@ -5328,6 +5377,25 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/micromark-extension-math": { + "version": "3.1.0", + "resolved": "https://registry.npmjs.org/micromark-extension-math/-/micromark-extension-math-3.1.0.tgz", + "integrity": "sha512-lvEqd+fHjATVs+2v/8kg9i5Q0AP2k85H0WUOwpIVvUML8BapsMvh1XAogmQjOCsLpoKRCVQqEkQBB3NhVBcsOg==", + "license": "MIT", + "dependencies": { + "@types/katex": "^0.16.0", + "devlop": "^1.0.0", + "katex": "^0.16.0", + "micromark-factory-space": "^2.0.0", + "micromark-util-character": "^2.0.0", + "micromark-util-symbol": "^2.0.0", + "micromark-util-types": "^2.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/micromark-extension-mdx-expression": { "version": "3.0.1", "resolved": "https://registry.npmjs.org/micromark-extension-mdx-expression/-/micromark-extension-mdx-expression-3.0.1.tgz", @@ -6691,6 +6759,25 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/rehype-katex": { + "version": "7.0.1", + "resolved": "https://registry.npmjs.org/rehype-katex/-/rehype-katex-7.0.1.tgz", + "integrity": "sha512-OiM2wrZ/wuhKkigASodFoo8wimG3H12LWQaH8qSPVJn9apWKFSH3YOCtbKpBorTVw/eI7cuT21XBbvwEswbIOA==", + "license": "MIT", + "dependencies": { + "@types/hast": "^3.0.0", + "@types/katex": "^0.16.0", + "hast-util-from-html-isomorphic": "^2.0.0", + "hast-util-to-text": "^4.0.0", + "katex": "^0.16.0", + "unist-util-visit-parents": "^6.0.0", + "vfile": "^6.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/rehype-parse": { "version": "9.0.1", "resolved": "https://registry.npmjs.org/rehype-parse/-/rehype-parse-9.0.1.tgz", @@ -6769,6 +6856,22 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/remark-math": { + "version": "6.0.0", + "resolved": "https://registry.npmjs.org/remark-math/-/remark-math-6.0.0.tgz", + "integrity": "sha512-MMqgnP74Igy+S3WwnhQ7kqGlEerTETXMvJhrUzDikVZ2/uogJCb+WHUg97hK9/jcfc0dkD73s3LN8zU49cTEtA==", + "license": "MIT", + "dependencies": { + "@types/mdast": "^4.0.0", + "mdast-util-math": "^3.0.0", + "micromark-extension-math": "^3.0.0", + "unified": "^11.0.0" + }, + "funding": { + "type": "opencollective", + "url": "https://opencollective.com/unified" + } + }, "node_modules/remark-mdx": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/remark-mdx/-/remark-mdx-3.1.1.tgz", diff --git a/package.json b/package.json index cad2df4..a6c4dc8 100644 --- a/package.json +++ b/package.json @@ -13,12 +13,14 @@ "@astrojs/react": "^4.4.2", "@astrojs/tailwind": "^5.1.5", "@astrojs/vue": "^5.1.4", - "@tailwindcss/typography": "^0.5.19", "astro": "^5.17.1", + "katex": "^0.16.33", "marked": "^17.0.3", "react": "^19.2.4", "react-dom": "^19.2.4", + "rehype-katex": "^7.0.1", + "remark-math": "^6.0.0", "tailwindcss": "^3.4.0", "vue": "^3.5.29" } diff --git a/src/components/react/MathFlipCard.tsx b/src/components/react/MathFlipCard.tsx new file mode 100644 index 0000000..804777a --- /dev/null +++ b/src/components/react/MathFlipCard.tsx @@ -0,0 +1,147 @@ +import { useState, useEffect, useRef } from 'react'; +import katex from 'katex'; + +interface MathFlipCardProps { + latex: string; + displayMode?: boolean; + className?: string; +} + +export default function MathFlipCard({ + latex, + displayMode = true, + className = '' +}: MathFlipCardProps) { + const [isFlipped, setIsFlipped] = useState(false); + const mathContainerRef = useRef(null); + + useEffect(() => { + if (mathContainerRef.current && !isFlipped) { + try { + katex.render(latex, mathContainerRef.current, { + displayMode: displayMode, + throwOnError: false, + trust: true, + }); + } catch (error) { + console.error('KaTeX rendering error:', error); + if (mathContainerRef.current) { + mathContainerRef.current.textContent = latex; + } + } + } + }, [latex, displayMode, isFlipped]); + + const containerStyle: React.CSSProperties = { + perspective: '1000px', + width: '100%', + minHeight: displayMode ? '120px' : '60px', + position: 'relative', + }; + + const innerStyle: React.CSSProperties = { + position: 'relative', + width: '100%', + minHeight: 'inherit', + transformStyle: 'preserve-3d', + transition: 'transform 0.6s cubic-bezier(0.4, 0, 0.2, 1)', + transform: isFlipped ? 'rotateY(180deg)' : 'rotateY(0deg)', + }; + + const faceStyle = (isFront: boolean): React.CSSProperties => ({ + position: 'absolute', + width: '100%', + minHeight: 'inherit', + backfaceVisibility: 'hidden', + borderRadius: '0.75rem', + padding: displayMode ? '1.5rem' : '0.75rem 1rem', + display: 'flex', + flexDirection: 'column', + alignItems: 'center', + justifyContent: 'center', + background: 'var(--color-muted, #f1f5f9)', + border: '1px solid var(--color-border, #e2e8f0)', + transform: isFront ? 'rotateY(0deg)' : 'rotateY(180deg)', + boxShadow: '0 2px 8px rgba(0, 0, 0, 0.08)', + }); + + const codeStyle: React.CSSProperties = { + fontFamily: 'var(--font-mono, "JetBrains Mono", monospace)', + fontSize: displayMode ? '0.9rem' : '0.85rem', + color: 'var(--color-foreground, #1e293b)', + background: 'transparent', + wordBreak: 'break-word', + textAlign: 'center', + width: '100%', + }; + + const buttonStyle: React.CSSProperties = { + position: 'absolute', + bottom: '0.5rem', + right: '0.5rem', + padding: '0.25rem 0.75rem', + fontSize: '0.75rem', + fontWeight: 500, + color: 'var(--primary-500, #0ea5e9)', + background: 'transparent', + border: '1px solid var(--primary-500, #0ea5e9)', + borderRadius: '0.375rem', + cursor: 'pointer', + transition: 'all 0.2s ease', + zIndex: 10, + }; + + const handleButtonClick = (e: React.MouseEvent) => { + e.stopPropagation(); + setIsFlipped(!isFlipped); + }; + + return ( +
+
+
+
+ +
+
+ 
{latex}
+ +
+
+
+ ); +} diff --git a/src/content/blog/latex-test.mdx b/src/content/blog/latex-test.mdx new file mode 100644 index 0000000..6903d39 --- /dev/null +++ b/src/content/blog/latex-test.mdx @@ -0,0 +1,116 @@ +--- +title: 'LaTeX 公式渲染测试' +description: '测试 LaTeX 数学公式渲染功能' +pubDate: 2026-03-01 +author: 'NovaBlog Team' +category: '测试' +tags: ['测试', 'LaTeX', '数学'] +--- + +import MathFlipCard from '../../components/react/MathFlipCard'; + +# LaTeX 公式渲染测试 + +## 行内公式 + +这是一个行内公式：$E = mc^2$，爱因斯坦的质能方程。 + +勾股定理：$a^2 + b^2 = c^2$ + +## 块级公式 + +高斯积分： + +$$ +\int_{-\infty}^{\infty} e^{-x^2} dx = \sqrt{\pi} +$$ + +## 翻转卡片公式展示 + +下面使用翻转卡片展示公式，点击"显示 LaTeX"按钮可以查看源码： + +### 质能方程 + + + +### 麦克斯韦方程组 + + + +### 薛定谔方程 + + + +### 傅里叶变换 + + + +### 矩阵运算 + + + +## 传统公式展示（对比） + +麦克斯韦方程组： + +$$ +\nabla \cdot \mathbf{E} = \frac{\rho}{\varepsilon_0} +$$ + +$$ +\nabla \cdot \mathbf{B} = 0 +$$ + +$$ +\nabla \times \mathbf{E} = -\frac{\partial \mathbf{B}}{\partial t} +$$ + +$$ +\nabla \times \mathbf{B} = \mu_0 \mathbf{J} + \mu_0 \varepsilon_0 \frac{\partial \mathbf{E}}{\partial t} +$$ + +## 复杂公式 + +薛定谔方程： + +$$ +i\hbar\frac{\partial}{\partial t}\Psi(\mathbf{r},t) = \left[-\frac{\hbar^2}{2m}\nabla^2 + V(\mathbf{r},t)\right]\Psi(\mathbf{r},t) +$$ + +傅里叶变换： + +$$ +\hat{f}(\xi) = \int_{-\infty}^{\infty} f(x) e^{-2\pi i x \xi} dx +$$ + +矩阵： + +$$ +\begin{pmatrix} +a & b \\ +c & d +\end{pmatrix} +\begin{pmatrix} +x \\ +y +\end{pmatrix} += +\begin{pmatrix} +ax + by \\ +cx + dy +\end{pmatrix} +$$ + +求和与积分： + +$$ +\sum_{i=1}^{n} i = \frac{n(n+1)}{2} +$$ + +$$ +\prod_{i=1}^{n} i = n! +$$ + +## 测试完成 + +如果你能看到以上公式正确渲染，说明 LaTeX 公式支持已经成功配置！ diff --git a/src/content/blog/react-animated-components.mdx b/src/content/blog/react-animated-components.mdx index 4a338c3..286bede 100644 --- a/src/content/blog/react-animated-components.mdx +++ b/src/content/blog/react-animated-components.mdx @@ -1,6 +1,6 @@ --- title: React 动效组件展示 -description: 展示 NovaBlog 中可用的 React 动效 HTML 组件，包括悬浮卡片、打字机效果、翻转卡片和粒子背景 +description: 展示 NovaBlog 中可用的 React 动效 HTML 组件，包括悬浮卡片、打字机效果、翻转卡片、粒子背景和数学公式卡片 pubDate: 2024-01-20 author: NovaBlog tags: [React, 动效, 组件, 教程] @@ -12,6 +12,7 @@ import AnimatedCard from '../../components/react/AnimatedCard'; import TypewriterText from '../../components/react/TypewriterText'; import FlipCard from '../../components/react/FlipCard'; import ParticleBackground from '../../components/react/ParticleBackground'; +import MathFlipCard from '../../components/react/MathFlipCard'; # React 动效组件展示 @@ -134,6 +135,53 @@ NovaBlog 支持在 MDX 中直接使用 React 组件，实现丰富的交互动
+## 📐 数学公式翻转卡片 (MathFlipCard) + +专门用于展示 LaTeX 数学公式的翻转卡片组件。正面显示渲染后的公式，点击"显示 LaTeX"按钮可以查看源码。 + +### 质能方程 + + + +### 麦克斯韦方程组 + + + +### 薛定谔方程 + + + +### 傅里叶变换 + + + +### 矩阵运算 + + + +### 使用方式 + +```tsx +import MathFlipCard from '../../components/react/MathFlipCard'; + + +``` + +**属性说明**： +- `latex`：LaTeX 公式字符串 +- `displayMode`：是否为块级公式（可选，默认为 true） +- `className`：自定义 CSS 类名（可选） + +**特点**： +- 点击"显示 LaTeX"按钮可查看公式源码 +- 点击"显示公式"按钮返回渲染结果 +- 支持 KaTeX 的所有语法 +- 适合教学和技术文档 + ## 📝 如何在文章中使用 ### 1. 导入组件 @@ -208,5 +256,6 @@ NovaBlog 提供了灵活的组件系统，让你可以在 Markdown 中嵌入丰 - ⌨️ **动态文字**：打字机、滚动、闪烁效果 - ✨ **背景特效**：粒子、波浪、光效 - 🎮 **交互功能**：计数器、表单、游戏 +- 📐 **数学公式**：翻转卡片展示 LaTeX 公式 快去尝试创建属于你自己的动效组件吧！ 🚀 \ No newline at end of file diff --git a/src/content/blog/typst-typesetting-showcase.mdx b/src/content/blog/typst-typesetting-showcase.mdx deleted file mode 100644 index 91f8273..0000000 --- a/src/content/blog/typst-typesetting-showcase.mdx +++ /dev/null @@ -1,202 +0,0 @@ ---- -title: Typst 学术排版展示 -description: 展示 NovaBlog 中 Typst 的高级排版能力，包括数学公式、矩阵等学术排版 -pubDate: 2024-01-25 -author: NovaBlog -tags: [Typst, 排版，数学公式，学术写作] -category: 教程 -heroImage: /images/hello-world.jpg ---- - -# Typst 学术排版展示 - -Typst 是一款现代化的排版系统，专为学术写作和技术文档设计。本文将展示 NovaBlog 中 Typst 的数学公式排版能力。 - -## 📐 基础数学公式 - -### 积分公式 - -``` -$ integral_0^infinity e^(-x^2) dif x = sqrt(pi) / 2 $ -``` - -### 极限与导数 - -``` -$ lim_(x arrow 0) frac(sin x, x) = 1 $ -``` - -``` -$ frac(dif f, dif x) = lim_(h arrow 0) frac(f(x + h) - f(x), h) $ -``` - -### 微积分基本定理 - -``` -$ integral_a^b f(x) dif x = F(b) - F(a) $ -``` - ---- - -## 🔢 矩阵与线性代数 - -### 基础矩阵 - -``` -$ A = mat(1, 2, 3; 4, 5, 6; 7, 8, 9) $ -``` - -### 行列式展开 - -``` -$ det(A) = sum_(i=1)^n a_(1i) dot (-1)^(1+i) dot M_(1i) $ -``` - -### 特征值方程 - -``` -$ det(A - lambda I) = 0 $ -``` - -### 二次型 - -``` -$ Q(x) = x^T A x = sum_(i,j) a_(ij) x_i x_j $ -``` - ---- - -## 📊 统计学与概率论 - -### 贝叶斯定理 - -``` -$ P(A | B) = frac(P(B | A) dot P(A), P(B)) $ -``` - -### 正态分布 - -``` -$ X tilde N(mu, sigma^2) arrow.f P(x) = frac(1, sigma sqrt(2 pi)) e^(-frac((x-mu)^2, 2 sigma^2)) $ -``` - -### 期望与方差 - -``` -$ E[X] = sum_(i=1)^n x_i p_i quad Var(X) = E[X^2] - (E[X])^2 $ -``` - ---- - -## 🧮 复杂嵌套表达式 - -### 巴塞尔问题 - -``` -$ sum_(n=1)^infinity frac(1, n^2) = frac(pi^2, 6) $ -``` - -### 欧拉恒等式 - -``` -$ e^(i pi) + 1 = 0 $ -``` - -### Gamma 函数 - -``` -$ Gamma(z) = integral_0^infinity t^(z-1) e^(-t) dif t $ -``` - -### 斯特林公式 - -``` -$ n! tilde sqrt(2 pi n) (n/e)^n $ -``` - ---- - -## ⚡ 物理学公式 - -### 麦克斯韦方程组 - -``` -$ nabla dot E = frac(rho, epsilon_0) $ -``` - -``` -$ nabla dot B = 0 $ -``` - -``` -$ nabla times E = -frac(partial B, partial t) $ -``` - -``` -$ nabla times B = mu_0 J + mu_0 epsilon_0 frac(partial E, partial t) $ -``` - -### 狭义相对论 - -``` -$ E = m c^2 $ -``` - -``` -$ t' = frac(t, sqrt(1 - v^2/c^2)) = gamma t $ -``` - -``` -$ gamma = frac(1, sqrt(1 - v^2/c^2)) $ -``` - -### 薛定谔方程 - -``` -$ i hbar frac(partial psi, partial t) = H^ psi $ -``` - ---- - -## 🔬 化学方程式 - -``` -$ 6 CO_2 + 6 H_2 O arrow.r C_6 H_12 O_6 + 6 O_2 $ -``` - -``` -$ CH_4 + 2 O_2 arrow.r CO_2 + 2 H_2 O $ -``` - ---- - -## 📐 集合论 - -``` -$ A union B = { x | x in A text( 或 ) x in B } $ -``` - -``` -$ A intersect B = { x | x in A text( 且 ) x in B } $ -``` - -``` -$ A setminus B = { x | x in A text( 且 ) x notin B } $ -``` - -``` -$ P(A) = { S | S subset.eq A } $ -``` - ---- - -## 总结 - -NovaBlog 曾经通过 TypstBlock 组件支持专业的数学公式排版，适合： - -- 📐 **数学博客**：微积分、线性代数、概率统计 -- ⚡ **物理笔记**：经典力学、电磁学、量子力学 -- 🔬 **化学公式**：化学反应方程式 -- 📊 **学术论文**：复杂的数学推导和证明 - -由于技术原因，Typst 支持已暂时移除。 \ No newline at end of file diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro index 0741e30..3570113 100644 --- a/src/layouts/BaseLayout.astro +++ b/src/layouts/BaseLayout.astro @@ -57,6 +57,13 @@ const socialImageURL = image.startsWith('http') ? image : new URL(image, site).h rel="stylesheet" /> + + +