Jak wymagać trybu, motywu lub dodatku do lustra kodu w browserify

Question

Czy ktoś próbuje użyć kodu lustrzanego przez przeglądarkę?

Uważam, że nic nie jest widoczne, mimo że wygenerowało już wszystkie tagi HTML.

Kod:

var CodeMirror = require('codemirror'); 
require('codemirror/mode/javascript/javascript.js'); 

    var editor = CodeMirror.fromTextArea(document.getElementById("code"), { 
    lineNumbers: true, 
    extraKeys: { 
     "Ctrl-Space": "autocomplete" 
    }, 
    mode: { 
     name: "javascript", 
     globalVars: true 
    } 
    }); 

Zastanawiam się, jak ja powinien wymagać tryb js?

Answer 1

I rzeczywiście dealed z tym problemem za pomocą require() dla wszystkich zależnościach demonstracji html5complete mode demo tak:

// require('codemirror/addon/hint/show-hint'); 
// require('codemirror/addon/hint/xml-hint'); 
// require('codemirror/addon/hint/html-hint'); 

require('codemirror/mode/xml/xml'); 
require('codemirror/mode/javascript/javascript'); 
require('codemirror/mode/css/css'); 
require('codemirror/mode/htmlmixed/htmlmixed'); 

var CodeMirror = require('codemirror/lib/codemirror'); 

var editor = CodeMirror.fromTextArea(textareaElement, { 
    mode: 'text/html', 
    lineWrapping: true, 
    extraKeys: { 
    'Ctrl-Space': 'autocomplete' 
    }, 
    lineNumbers: true, 
    theme: 'monokai' 
}); 

w moim .less plików, sprowadziłam CSS tak:

@import (inline) "./../../node_modules/codemirror/lib/codemirror.css"; 
@import (inline) "./../../node_modules/codemirror/theme/monokai.css"; 
// @import (inline) "./../../node_modules/codemirror/addon/hint/show-hint.css"; 

Nie dbałem o jakość tej sztuczki.

Answer 2

Oto, co działa dla mnie. Korzystanie z importu zamiast wymagać, ale sam sens:

import 'codemirror/theme/3024-night.css' 
 

 
const options = { 
 
     lineNumbers: true, 
 
     readOnly: false, 
 
     mode: 'htmlmixed', 
 
     theme:'3024-night' 
 
}; 
 

 
... 
 

 

 
<Codemirror ref="editor" value={this.props.value} onChange={this.props.updateCode} options={options}/>