fix: update highlighter initialization to use async/await for improved performance

This commit is contained in:
ngc2207 2025-01-08 15:28:05 +08:00
parent 4476348bcb
commit 7ecc17e8a6
2 changed files with 12 additions and 8 deletions

View File

@ -55,8 +55,8 @@ function App() {
defaultLanguage={file.language} defaultLanguage={file.language}
defaultValue={file.value} defaultValue={file.value}
options={{ automaticLayout: true, minimap: { enabled: false } }} options={{ automaticLayout: true, minimap: { enabled: false } }}
beforeMount={(monaco: Monaco) => { beforeMount={async (monaco: Monaco) => {
shikiToMonaco(highlighter, monaco); shikiToMonaco(await highlighter, monaco);
}} }}
/> />
</TabsContent> </TabsContent>
@ -67,8 +67,8 @@ function App() {
original={file.value} original={file.value}
modified={file.value} modified={file.value}
options={{ automaticLayout: true, minimap: { enabled: false } }} options={{ automaticLayout: true, minimap: { enabled: false } }}
beforeMount={(monaco: Monaco) => { beforeMount={async (monaco: Monaco) => {
shikiToMonaco(highlighter, monaco); shikiToMonaco(await highlighter, monaco);
}} }}
/> />
</TabsContent> </TabsContent>

View File

@ -10,7 +10,11 @@ const SUPPORTED_EDITOR_LANGUAGES_ID = Object.values(
SUPPORTED_EDITOR_LANGUAGES_CONFIG SUPPORTED_EDITOR_LANGUAGES_CONFIG
).map((language: { id: string }) => language.id); ).map((language: { id: string }) => language.id);
export const highlighter = await createHighlighter({ async function initHighlighter() {
return await createHighlighter({
themes: SUPPORTED_EDITOR_THEMES_ID, themes: SUPPORTED_EDITOR_THEMES_ID,
langs: SUPPORTED_EDITOR_LANGUAGES_ID, langs: SUPPORTED_EDITOR_LANGUAGES_ID,
}); });
}
export const highlighter = initHighlighter();