// import { loadLanguage } from "@uiw/codemirror-extensions-langs";
import { javascript } from "@codemirror/lang-javascript";
import { lintGutter } from "@codemirror/lint";
import ReactCodeMirror, { ViewUpdate } from "@uiw/react-codemirror";
import { basicSetup } from "codemirror";
// import Linter from "eslint4b-prebuilt";
import { liquid } from "@codemirror/lang-liquid";
type CodeEditorProps = {
value?: string;
custom_class?: string;
height?: string;
onChange?(value: string, viewUpdate: ViewUpdate): void;
};
const CodeEditor = ({ value, custom_class, height, onChange }: CodeEditorProps) => {
console.log(liquid);
return (
<ReactCodeMirror
value={value}
height={height || "200px"}
className={custom_class || ""}
extensions={[
// linter(esLint(new Linter())),
lintGutter(),
basicSetup,
javascript({ typescript: true }),
]}
onChange={onChange}
/>
// <div ref={editorRef}></div>
);
};
export default CodeEditor;
this is my react CodeMirror component. Here when I import liquid lang it shows an error that is
chunk-CDNOX654.js?v=b4b29545:1471 Uncaught TypeError: Cannot read properties of undefined (reading ‘deserialize’)
at setProp (chunk-CDNOX654.js?v=b4b29545:1471:42)
at new _LRParser (chunk-CDNOX654.js?v=b4b29545:1485:15)
at _LRParser.deserialize (chunk-CDNOX654.js?v=b4b29545:1748:12)
at chunk-HVTTSDAU.js?v=b4b29545:2240:23
type or paste code here