react-codemirror
react-codemirror copied to clipboard
How to set up automatic line wrapping?
I tried to find this configuration in the document, but I didn't find it !
@Deja-vuuu
- https://github.com/uiwjs/react-codemirror/issues/514#issuecomment-1574414930
- https://github.com/uiwjs/react-codemirror/issues/274#issuecomment-1060137121
- https://github.com/uiwjs/react-codemirror/issues/228#issuecomment-1057144653
@Deja-vuuu
The problem is, however, that the following code:
import CodeMirror, { BasicSetupOptions } from "@uiw/react-codemirror"
import { langs } from "@uiw/codemirror-extensions-langs"
import { githubLight } from "@uiw/codemirror-theme-github"
import { EditorView } from "@codemirror/view"
const CodemirrorEditor: React.FC<CodemirrorProps> = ({ content, onChange }) => {
return (
<CodeMirror
extensions={[langs.markdown(), EditorView.lineWrapping]}
theme={githubLight}
value={content}
basicSetup={basicSetup}
onChange={ (value, viewUpdate) => {
onChange(value)
}}
/>
)
}
Throws an error:
Unrecognized extension value in extension set ([object Object]). This sometimes happens because multiple instances of @codemirror/state are loaded, breaking instanceof checks.
@Deja-vuuu
The problem is, however, that the following code:
import CodeMirror, { BasicSetupOptions } from "@uiw/react-codemirror" import { langs } from "@uiw/codemirror-extensions-langs" import { githubLight } from "@uiw/codemirror-theme-github" import { EditorView } from "@codemirror/view" const CodemirrorEditor: React.FC<CodemirrorProps> = ({ content, onChange }) => { return ( <CodeMirror extensions={[langs.markdown(), EditorView.lineWrapping]} theme={githubLight} value={content} basicSetup={basicSetup} onChange={ (value, viewUpdate) => { onChange(value) }} /> ) }
Throws an error:
Unrecognized extension value in extension set ([object Object]). This sometimes happens because multiple instances of @codemirror/state are loaded, breaking instanceof checks.
You have to import EditorView
from @uiw/react-codemirror
.
import CodeMirror, { EditorView } from '@uiw/react-codemirror'