scniro / react-codemirror2

Codemirror integrated components for React
MIT License
1.66k stars 193 forks source link

Trouble rendering codemirror #97

Closed lingxiao closed 6 years ago

lingxiao commented 6 years ago

I have the following Container build around CodeMirror2:

import React, { Component } from 'react';
import { Uncontrolled as CodeMirror } from 'react-codemirror2';
require('codemirror/mode/xml/xml');
require('codemirror/mode/javascript/javascript');

export class EditorContainer extends Component {

    constructor(props){
        super(props);
        this.state = { code : '' }
    }

    render(){

        const OPT = {
              mode: 'javascript'
            , theme: 'material'
            , lineNumbers: true
        };

        return (

            <CodeMirror
                value    = {null}
                options  = {OPT}                      
                onChange = { (editor, data, value) => { console.log(`code mirror: ${value}`)} }
            />
        )
    }

}

Which crashes on load with error:

index.js:2178 Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

This is completely bewildering to me. Am I using it correctly?

scniro commented 6 years ago

Casing is resulting in an undefined component. Change Uncontrolled => UnControlled

Sent with GitHawk

scniro commented 6 years ago

@lingxiao Closing due to inactivity, please reopen if you can provide more detail, but I think you'll be squared away with the above suggestion