mirror of
https://github.com/davidkaya/aryx.git
synced 2026-08-06 19:58:43 +02:00
feat: enable Prism syntax highlighting in code blocks
- Register CodeHighlightNode in the editor node set - Add CodeHighlightPlugin that calls registerCodeHighlighting - Map 20+ Prism token types to mc-tok-* CSS classes with dark theme colors - Explicitly import prismjs + language components and set globalThis.Prism before @lexical/code-prism loads, fixing a Vite dev-mode race where the CJS shim could initialize the tokenizer before the global was set - Added @types/prismjs for type checking Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
This commit is contained in:
@@ -25,6 +25,7 @@
|
||||
"@lexical/headless": "0.42.0",
|
||||
"@tailwindcss/vite": "^4.2.2",
|
||||
"@types/node": "^25.5.0",
|
||||
"@types/prismjs": "^1.26.6",
|
||||
"@types/react": "^19.2.14",
|
||||
"@types/react-dom": "^19.2.3",
|
||||
"@vitejs/plugin-react": "5.1.0",
|
||||
@@ -338,6 +339,8 @@
|
||||
|
||||
"@types/node": ["@types/node@25.5.0", "", { "dependencies": { "undici-types": "~7.18.0" } }, "sha512-jp2P3tQMSxWugkCUKLRPVUpGaL5MVFwF8RDuSRztfwgN1wmqJeMSbKlnEtQqU8UrhTmzEmZdu2I6v2dpp7XIxw=="],
|
||||
|
||||
"@types/prismjs": ["@types/prismjs@1.26.6", "", {}, "sha512-vqlvI7qlMvcCBbVe0AKAb4f97//Hy0EBTaiW8AalRnG/xAN5zOiWWyrNqNXeq8+KAuvRewjCVY1+IPxk4RdNYw=="],
|
||||
|
||||
"@types/react": ["@types/react@19.2.14", "", { "dependencies": { "csstype": "^3.2.2" } }, "sha512-ilcTH/UniCkMdtexkoCN0bI7pMcJDvmQFPvuPvmEaYA/NSfFTAgdUSLAoVjaRJm7+6PvcM+q1zYOwS4wTYMF9w=="],
|
||||
|
||||
"@types/react-dom": ["@types/react-dom@19.2.3", "", { "peerDependencies": { "@types/react": "^19.2.0" } }, "sha512-jp2L/eY6fn+KgVVQAOqYItbF0VY/YApe5Mz2F0aykSO8gx31bYCZyvSeYxCHKvzHG5eZjc+zyaS5BrBWya2+kQ=="],
|
||||
|
||||
@@ -34,6 +34,7 @@
|
||||
"@lexical/headless": "0.42.0",
|
||||
"@tailwindcss/vite": "^4.2.2",
|
||||
"@types/node": "^25.5.0",
|
||||
"@types/prismjs": "^1.26.6",
|
||||
"@types/react": "^19.2.14",
|
||||
"@types/react-dom": "^19.2.3",
|
||||
"@vitejs/plugin-react": "5.1.0",
|
||||
|
||||
@@ -20,7 +20,31 @@ import {
|
||||
$convertFromMarkdownString,
|
||||
$convertToMarkdownString,
|
||||
} from '@lexical/markdown';
|
||||
import { $isCodeNode, $createCodeNode, CodeNode, registerCodeHighlighting } from '@lexical/code';
|
||||
import { $isCodeNode, $createCodeNode, CodeNode } from '@lexical/code';
|
||||
|
||||
// Prism must be on `globalThis` before @lexical/code-prism initializes its
|
||||
// tokenizer reference. Vite's dev-mode esbuild CJS shim can race the global
|
||||
// assignment, so we force it here before importing the module.
|
||||
import Prism from 'prismjs';
|
||||
import 'prismjs/components/prism-clike';
|
||||
import 'prismjs/components/prism-javascript';
|
||||
import 'prismjs/components/prism-markup';
|
||||
import 'prismjs/components/prism-markdown';
|
||||
import 'prismjs/components/prism-c';
|
||||
import 'prismjs/components/prism-css';
|
||||
import 'prismjs/components/prism-objectivec';
|
||||
import 'prismjs/components/prism-sql';
|
||||
import 'prismjs/components/prism-python';
|
||||
import 'prismjs/components/prism-rust';
|
||||
import 'prismjs/components/prism-swift';
|
||||
import 'prismjs/components/prism-typescript';
|
||||
import 'prismjs/components/prism-java';
|
||||
import 'prismjs/components/prism-cpp';
|
||||
if (typeof globalThis !== 'undefined') {
|
||||
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
||||
(globalThis as any).Prism = Prism;
|
||||
}
|
||||
import { registerCodeHighlighting } from '@lexical/code-prism';
|
||||
import {
|
||||
$isListNode,
|
||||
INSERT_ORDERED_LIST_COMMAND,
|
||||
|
||||
Reference in New Issue
Block a user