feat: 删除无用依赖,shiki lang使用懒加载方式加载语言
This commit is contained in:
@@ -5,41 +5,37 @@ const DEFAULT_THEME = 'github-dark-dimmed'
|
||||
|
||||
const highlighter = await createHighlighter({
|
||||
themes: [DEFAULT_THEME],
|
||||
langs: [
|
||||
"bash",
|
||||
"json",
|
||||
"yaml",
|
||||
"xml",
|
||||
"html",
|
||||
"css",
|
||||
"scss",
|
||||
"javascript",
|
||||
"typescript",
|
||||
"jsx",
|
||||
"tsx",
|
||||
"vue",
|
||||
"markdown",
|
||||
"sql",
|
||||
"python",
|
||||
"go",
|
||||
"dockerfile",
|
||||
"nginx"
|
||||
]
|
||||
langs: []
|
||||
})
|
||||
|
||||
const resolveLang = (lang: string) => {
|
||||
const supported = highlighter.getLoadedLanguages?.() || []
|
||||
if (!lang) return 'text'
|
||||
if (supported.includes(lang)) return lang
|
||||
return 'text'
|
||||
const SUPPORTED_LANGS = [
|
||||
"bash", "json", "yaml", "xml", "html", "css", "scss",
|
||||
"javascript", "typescript", "jsx", "tsx", "vue",
|
||||
"markdown", "sql", "python", "go", "dockerfile", "nginx"
|
||||
] as const
|
||||
|
||||
const loadedLangs = new Set<string>(['text'])
|
||||
|
||||
type SupportedLang = typeof SUPPORTED_LANGS[number]
|
||||
|
||||
const supportedSet = new Set<string>(SUPPORTED_LANGS)
|
||||
|
||||
const ensureLangLoaded = async (lang: string): Promise<string> => {
|
||||
if (lang === 'text' || loadedLangs.has(lang)) return lang
|
||||
if (!supportedSet.has(lang)) return 'text'
|
||||
try {
|
||||
await highlighter.loadLanguage(lang as SupportedLang)
|
||||
loadedLangs.add(lang)
|
||||
return lang
|
||||
} catch {
|
||||
return 'text'
|
||||
}
|
||||
}
|
||||
|
||||
export const processHtmlWithJsdom = async (rawHtml: string) => {
|
||||
|
||||
const dom = new JSDOM(rawHtml)
|
||||
const document = dom.window.document
|
||||
|
||||
// 高亮处理代码块
|
||||
const codeBlocks = document.querySelectorAll('pre code')
|
||||
|
||||
for (const codeBlock of codeBlocks) {
|
||||
@@ -55,9 +51,8 @@ export const processHtmlWithJsdom = async (rawHtml: string) => {
|
||||
}
|
||||
}
|
||||
|
||||
lang = resolveLang(lang)
|
||||
lang = await ensureLangLoaded(lang) // ← 唯一改动点:按需加载
|
||||
|
||||
// 高亮
|
||||
const highlighted = highlighter.codeToHtml(codeContent, {
|
||||
lang,
|
||||
theme: DEFAULT_THEME,
|
||||
@@ -116,5 +111,5 @@ export const processHtmlWithJsdom = async (rawHtml: string) => {
|
||||
}
|
||||
}
|
||||
|
||||
return dom.serialize()
|
||||
return document.body.innerHTML
|
||||
}
|
||||
|
||||
@@ -140,6 +140,8 @@ const published_at = formatDatetime(data.published_at, "YYYY.MM.DD");
|
||||
const article = document.querySelector(".markdown-body")!;
|
||||
const images = Array.from(article.querySelectorAll("img"));
|
||||
|
||||
if(images.length === 0) return
|
||||
|
||||
const waitImageLoaded = (img: HTMLImageElement) => {
|
||||
if (img.complete && img.naturalWidth > 0 && img.naturalHeight > 0) {
|
||||
return Promise.resolve();
|
||||
|
||||
Reference in New Issue
Block a user