Stack Overflow
Stack Overflow

Questions tagged [react-codemirror2]

15 questions
4
votes
1 answer

CodeMirror 6 React Wrapper?

I'm starting to use CodeMirror 6 (aka. next for the time being) in a React project. In the past, I've used React CodeMirror 2 as a wrapper. Is there anything similar available for the upcoming version of CodeMirror?
Marc Polizzi
  • 9,275
  • 3
  • 36
  • 61
3
votes
4 answers

React Codemirror2 does not install

When I try to install react-codemirror2 it gave an error and doesn't install in my app (my react version is @17.0.2) Why it doesn't install? Error list in below npm ERR! code ERESOLVE npm ERR! ERESOLVE unable to resolve dependency tree npm ERR! npm…
Mahdi Heydari
  • 41
  • 1
  • 4
2
votes
2 answers

How to get a value from code mirror in react js?

I am trying to get a value from the code mirror input field but I don't know why I am not getting the value from code mirror input field import CodeMirror from "@uiw/react-codemirror"; import { markdown, markdownLanguage } from…
TulaMaagar
  • 23
  • 3
1
vote
1 answer

react-codemirror2 creating two editors

I am using codemirror and react-codemirror2 to create code editor, I am using the Controlled component once but its showing two editors, When I type on the first editor it is reflecting on the 2nd one Code: import…
Veera Silamban
  • 223
  • 1
  • 14
1
vote
2 answers

Enable yaml linting in codemirror

I want to enable linting for yaml in code mirror but even after adding lint:true I am unable to see linting for yaml, the same works fine for other language like JavaScript.
Noob
  • 11
  • 3
1
vote
2 answers

How to add close bracket and close tag for react code mirror

I'm using react-codemirror2 in a react project. I want to add features like auto bracket close and auto tag close. There is a npm package called @codemirror/closebrackets but I can't find any documentation to do that.
Pranavan
  • 1,287
  • 1
  • 6
  • 18
0
votes
0 answers

How to underline errors in CodeMirror using a custom linter?

I am currently building a code editor with a custom mode. This is how it is defined: let codeMirror = CodeMirror.fromTextArea(textArea, { mode: "customMode", lint: true, theme: customtheme } I then create a…
Aidan
  • 26
  • 5
0
votes
0 answers

react-codemirror2 controlled usage, What's the purpose of onChange?

Referring to the github page example below react-codemirror2-github import {Controlled as CodeMirror} from 'react-codemirror2' { …
Jeffargo
  • 1
  • 1
0
votes
0 answers

Nothing Shows on the Editor when I write on it (React-Codemirror2)

When i write on the Editor it displays nothing but on the Output Screen the Output is displayed Properly. its really confusing me. It's my first time using Codemirror so Please Help.
Rana Talha
  • 13
  • 2
0
votes
1 answer

Add Custom theme to react-codemirror2?

I dropped the theme into the react-codemirror2 folder inside the node modules folder, but the theme could not be found when building, because when I copy the new packages, the file disappears. How to create a custom theme?
Abbos Rakhmonov
  • 3
  • 1
0
votes
1 answer

How to enable syntax validation in react-codemirror editor for javascript language in nextjs

I am using react-codemirror2 Editor in my Next.js application. The editor by default marks the syntax validation errors and warnings. I want to make sure when the user saves the code there is no syntax error in the code. I need to access the…
Mohammad Reza Hosainy
  • 73
  • 5
0
votes
1 answer

How to get the code inside codemirror on Onblur Operation

I can get the data in textArea from onChange operation, but that is costing me too much state rendering causing my area to get out of focus. I want to get the textWritten in codeArea on Onblur event. OnBlur event is returning only DOMEvent. How can…
Abhishek Kumar
  • 820
  • 12
  • 16
0
votes
1 answer

How to change the value using data object in code mirror

I'm using react-codemirror2 for online code editor kind of project. I want to implement my own real time collaborative platform. In quill js we can use delta object to do this. In code mirror we can get 'data' object from onBeforeChange event…
Pranavan
  • 1,287
  • 1
  • 6
  • 18
0
votes
1 answer

Syntax highlighter not working using codemirror 2 with Next.js

I saw many examples it works fine for all but I don't know why it does not highlight my code. I tried many solutions none of them work for me. Also, I need to inject my own custom HTML file in it for the initial when user click on demo for the code…
Akash Maurya
  • 127
  • 1
  • 3
  • 8
0
votes
1 answer

require vs import syntax in react-codemirror2

Totally confused by this example in react-codemirror2 which uses both import and require syntax; [See https://github.com/scniro/react-codemirror2 in the section requiring codemirror resources] import CodeMirror from 'react-codemirror2';…
joedotnot
  • 4,810
  • 8
  • 59
  • 91