feat: replace PrismJS with highlight.js for code syntax highlighting

PrismJS's CJS global state is fundamentally incompatible with Vite's ESM
dev mode, causing missing language support (~40% of dropdown languages)
and fragile loading hacks (optimizeDeps, global assignment).

Replace the entire Prism integration with highlight.js/lib/common which
is ESM-native, has no global state, and covers all 22 dropdown languages
out of the box (~37 common languages included).

Implementation:
- Custom CodeHighlightPlugin using hljs.highlight() for tokenization
- HTML parser extracts flat tokens from hljs output (handles nested spans)
- Token type mapping from hljs scopes to Lexical codeHighlight theme keys
- Selection preservation via absolute character offset save/restore
- Re-entrancy guard prevents infinite transform loops
- Removed @lexical/code-prism import and Vite optimizeDeps workaround

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
David Kaya
2026-03-25 20:08:14 +01:00
co-authored by Copilot
parent 2338d7c44b
commit 4f202274db
4 changed files with 250 additions and 22 deletions
-6
View File
@@ -33,12 +33,6 @@ export default defineConfig({
build: {
outDir: 'dist/renderer',
},
optimizeDeps: {
// @lexical/code-prism depends on prismjs + its language components via
// CJS require(). Vite must pre-bundle them together so that the Prism
// global is available when component IIFEs execute.
include: ['prismjs', '@lexical/code-prism'],
},
plugins: [react(), tailwindcss()],
resolve: {
alias: {