// 伪代码示例
visit(tree, (node: any) => {
    if (node.type === "image") hasImage = true;
    if (node.type === "math") hasKatex = true;
    if (node.type === "code" && node.lang === "mermaid") {
        hasMermaid = true;
        // 将代码块转换为特定格式以便前端渲染
        node.type = "html";
        node.value = `<pre class="mermaid">${node.value}</pre>`;
    }
});

---
import "katex/dist/katex.min.css";
---
<!-- 无内容,只有frontmatter静态导入的css -->

---
import "photoswipe/dist/photoswipe.css";
---
<!-- 无内容,只有frontmatter静态导入的css -->

---
// 仅在需要时引入组件
import KatexStyle from "@components/stalux/posts/KatexStyle.astro";
import PhotoSwipeStyle from "@components/stalux/posts/PhotoSwipeStyle.astro";
const { hasKatex, hasImage, hasMermaid } = Astro.props;
---
{hasKatex && <KatexStyle />}
{hasImage && <PhotoSwipeStyle />}
<!-- 页面内容 -->
<slot />
{hasMermaid && (
    <script>
        import mermaid from "mermaid";
        // 动态初始化逻辑...
    </script>
)}