feat(frontend): Shiki 白名单语言高亮并支持 aardio

显式加载常用语言;修复 pretty-code 去 shiki class 导致不上色,以及 aardio 循环别名。

Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
2026-09-16 06:09:25 +08:00
parent 3f88b38610
commit 8d5e00a112
7 changed files with 290 additions and 23 deletions

View File

@@ -136,18 +136,11 @@ export default function MdCodeBlock({ children, className, ...rest }: MdCodeBloc
let cancelled = false;
(async () => {
try {
const { codeToHtml } = await import("shiki");
const html = await codeToHtml(plainText.replace(/\n$/, ""), {
lang: lang === "text" ? "plaintext" : lang,
themes: {
light: "github-light",
dark: "github-dark-dimmed",
},
defaultColor: false,
});
const { siteCodeToHtml } = await import("./shikiHighlighter");
const html = await siteCodeToHtml(plainText.replace(/\n$/, ""), lang);
if (!cancelled) setClientHtml(html);
} catch {
// 未知语言:保持纯文本
// 未知语言 / 加载失败:保持纯文本
}
})();
return () => {
@@ -185,7 +178,7 @@ export default function MdCodeBlock({ children, className, ...rest }: MdCodeBloc
}
};
const preClass = ["md-code-pre", className].filter(Boolean).join(" ");
const preClass = ["md-code-pre", "shiki", className].filter(Boolean).join(" ");
return (
<div className="md-code-block" ref={rootRef}>