From 0a571d7c9c49890ec4f95784c4c491a352516c0f Mon Sep 17 00:00:00 2001 From: Maksim Sukharev Date: Mon, 25 Nov 2024 23:45:35 +0100 Subject: [PATCH] fix(NcRichText): adjust import conditions for rehype-highlight library Signed-off-by: Maksim Sukharev --- src/components/NcRichText/NcRichText.vue | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/src/components/NcRichText/NcRichText.vue b/src/components/NcRichText/NcRichText.vue index b0bb021ddd..c00ea06b84 100644 --- a/src/components/NcRichText/NcRichText.vue +++ b/src/components/NcRichText/NcRichText.vue @@ -321,15 +321,13 @@ import { RouterLink } from 'vue-router' /** * Heavy libraries should be loaded on demand to reduce component size */ -let rehypeHighlight -const rehypeHighlightLoaded = ref(false) +const rehypeHighlight = ref(null) /** * Load 'rehype-highlight' library when code block is rendered with `useExtendedMarkdown` */ -async function importRehypeLibrary() { +async function importRehypeHighlightLibrary() { const module = await import('rehype-highlight') - rehypeHighlight = module.default - rehypeHighlightLoaded.value = true + rehypeHighlight.value = module.default } export default { @@ -470,7 +468,7 @@ export default { }, }, }) - .use((this.useExtendedMarkdown && rehypeHighlightLoaded.value) ? rehypeHighlight : undefined) + .use(this.useExtendedMarkdown ? rehypeHighlight.value : undefined) // .use(rehypeAddClasses, this.markdownCssClasses) .use(remarkPlaceholder) .use(rehypeExternalLinks, { @@ -523,8 +521,9 @@ export default { if (!String(type).startsWith('#')) { let nestedNode = null if (this.useExtendedMarkdown) { - if (String(type) === 'code' && !rehypeHighlightLoaded.value) { - importRehypeLibrary() + if (String(type) === 'code' && !rehypeHighlight.value + && props?.class?.includes('language')) { + importRehypeHighlightLibrary() } if (String(type) === 'li' && Array.isArray(children) && children[0].type === 'input'