packages/frontend/src/scripts/code-highlighter.ts


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33

import { getHighlighterCore, loadWasm } from 'shiki/core';
import darkPlus from 'shiki/themes/dark-plus.mjs';
import type { Highlighter, LanguageRegistration } from 'shiki';

let _highlighter: Highlighter | null = null;

export async function getHighlighter(): Promise<Highlighter> {
	if (!_highlighter) {
		return await initHighlighter();
	}
	return _highlighter;
}

export async function initHighlighter() {
	const aiScriptGrammar = await import('aiscript-vscode/aiscript/syntaxes/aiscript.tmLanguage.json');

	await loadWasm(import('shiki/onig.wasm?init'));

	const highlighter = await getHighlighterCore({
		themes: [darkPlus],
		langs: [
			import('shiki/langs/javascript.mjs'),
			{
				aliases: ['is', 'ais'],
				...aiScriptGrammar.default,
			} as unknown as LanguageRegistration,
		],
	});

	_highlighter = highlighter;

	return highlighter;
}