CodeSandBox/monaco-editor-lsp-next
2
0
Fork 0
mirror of https://github.com/cfngc4594/monaco-editor-lsp-next.git synced 2025-05-18 15:26:36 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

feat(code-editor): integrate Shiki highlighter for enhanced syntax highlighting

Browse Source
This commit is contained in:
cfngc4594 2025-02-19 23:03:11 +08:00
parent 5ca8ef91ea
commit fd48fa0fff
1 changed files with 9 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
src/components/code-editor.tsx
View File

@ -8,6 +8,8 @@ import {
import { useEffect } from "react";
import dynamic from "next/dynamic";
import normalizeUrl from "normalize-url";
import { createHighlighter } from 'shiki';
import { shikiToMonaco } from '@shikijs/monaco';
import { Skeleton } from "@/components/ui/skeleton";
const DynamicEditor = dynamic(
@ -77,6 +79,13 @@ export default function CodeEditor() {
defaultLanguage="c"
defaultValue="# include<stdio.h>"
path="file:///main.c"
beforeMount={async (monaco) => {
const highlighter = await createHighlighter({
themes: ["github-light-default", "github-dark-default"],
langs: ["c"]
})
shikiToMonaco(highlighter, monaco)
}}
onValidate={(markers) => {
markers.forEach((marker) =>
console.log("onValidate:", marker.message)