Codemirror Component for React.js by Jed Watson.
Questions tagged [react-codemirror]
48 questions
7
votes
1 answer
How to do autosuggest css keywords with React Codemirror?
I am trying to achieve autosuggestions for css with code mirror browser editor using a react wrapper lib https://www.npmjs.com/package/react-codemirror2
I've tried editor.execCommand('autocomplete'); on onchange event but It crashes the browser
My…
Nane
- 2,370
- 6
- 34
- 74
7
votes
1 answer
Codemirror shows JSON all on single line
Started a new project using react-codemirror2 and react-jsonschema-form very similar too https://mozilla-services.github.io/react-jsonschema-form/
However when my codemirror editor renders the JSON I am loading all shows on a single line. I have…
chinds
- 1,761
- 4
- 28
- 54
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
1 answer
react codemirror 2 how to show the variables entered before
I am using ReactCodemirror2 wrapper in order to bring a Javascript Editor to my ReactJS app. The thing is I can't figure it out how to reuse the defined variables, I mean this:
as you can see firstNumber does not appears on the autocompletion…
assembler
- 3,098
- 12
- 43
- 84
3
votes
1 answer
Saving changes from a custom component in React-Admin
How do I save the output of a custom component back into the React Admin model?
I have a form with one custom component, which is a CodeMirror field. The changes to everything else save properly. But my CodeMirror field, while working properly as…
Scott Sauyet
- 49,207
- 4
- 49
- 103
3
votes
2 answers
react-codemirror beforeChange event
I am using react-codemirror node module as follows:
danday74
- 52,471
- 49
- 232
- 283
2
votes
1 answer
Codemirror Error: Uncaught Error: Unrecognized extension value in extension set ([object Object])
all. I'm currently working on a React + Electron project, the project aims to complete a markdown editor. When I config the codemirror,
the program reported an error said, Uncaught Error: Unrecognized extension value in extension set ([object…
leo0807
- 941
- 1
- 8
- 21
2
votes
1 answer
React-codemirror 2 linting feature not working
I have created a react-codemirror 2 component in my react app but the linting feature of the package is not working. I tried browsing other stack overflow questions but since the questions are at least 2 years old it looks like the file structure…
Sarthak Kundra
- 85
- 7
2
votes
0 answers
ReactJS: Display another UI element on top of codemirror editor
I have a codemirror object. I'd like to display a tippy button on top of the codemirror editory when the cursor hovers over the code.
So far I can detect when the mouse is hovering, but I can't display anything on top of the editor. My code is…
maddie
- 1,854
- 4
- 30
- 66
1
vote
1 answer
CodeMirror says Unrecognized extension value in extension set
Unrecognized extension value in extension set ([object Object]). This sometimes happens because multiple instances of @codemirror/state are loaded, breaking instanceof checks.
import React, { useEffect, useState, useRef } from 'react'
import {…
Aman Singh
- 13
- 4
1
vote
0 answers
Error while importing: 'codemirror/lib/codemirror.css'
Code:
import React from 'react'
import 'codemirror/lib/codemirror.css';
export default function Editor() {
return (
Editor
)
}
Error:
Module not found: Error: Can't resolve 'codemirror/lib/codemirror.css'
Please provide a…
vinayak
- 11
- 3
1
vote
0 answers
How get highlight text in react-codemirror
I'm using react-codemirror to render input with highlighted one letter. But I can't find how to mark text in CodeMirror component.
I tried
const refs = useRef(null);
useEffect(() => {
if (refs.current?.view) {
…
peon123
- 266
- 1
- 8
1
vote
1 answer
Best CodeMirror package for React with typescript
I was trying to implement a codeMirror in a existing react(with typescript) App. Can anyone please suggest a package that works fine with typescript as well.
ArushRaj
- 31
- 1
- 5
1
vote
1 answer
CodeMirror editor duplicating
So I am trying to insert a code editor into my web application.
I am trying to import and add an instance of Codemirror.
Everytime I add JSX code for a CodeMirror component it duplicates.
Here is my component code.
import { Controlled as…
Samir Zafar
- 56
- 4
1
vote
1 answer
How to use custom CodeMirror modes using react-codemirror2
How do you use custom CodeMirror modes when using react-codemirror2? Both CodeMirror.defineSimpleMode and CodeMirror.defineMode are undefined after I import as follows:
import {UnControlled as CodeMirror} from "react-codemirror2";
import…
User
- 339
- 5
- 16