2015-09-07 48 views
0

我使用的代码镜像在Extjs5的应用程序,以主题为“ABCDEF”激活我怎么能在默认情况下,在CodeMirror代码颜色(高亮)

然而,代码文本只是白色的,没有颜色。

如何在默认情况下激活CodeMirror中的代码颜色(突出显示)。

为了更好的情境看到这个Post

编辑

我多行文本:

items:[{ 
xtype: 'textarea', 
anchor:'100%', 
// name: 'scripts', 
itemId:'textareaItemId', 
height:'100%', 
autoScroll: true, 
listeners: { 
     afterrender:function(textarea){ 
      var editableCodeMirror = CodeMirror.fromTextArea(textarea.getEl().query('textarea')[0], { 
        mode: "javascript", 
        theme: "abcdef", 
        lineNumbers: true, 
        keyMap:"sublime", 
        content: '', 
        matchBrackets: true, 
        electricChars:true, 
        autoClearEmptyLines: true, 
        extraKeys: {"Enter": "newlineAndIndentContinueComment"} 
      }); 
      editableCodeMirror.setSize('100%', '100%'); 
     } 
    } 
}], 

网格听众我itemClick在方法:

itemclick: function(grid, record, item, index, e, eOpts) { 
    var textAreaForCodeMirror = Ext.ComponentQuery.query('#textareaItemId')[0]; 
    var editableCodeMirror = textAreaForCodeMirror.getEl().query('.CodeMirror')[0].CodeMirror; 
    editableCodeMirror.getDoc().setValue(record.get('scripts')); 
}, 

CodeMirror文件:

<link rel="stylesheet" type="text/css" href="CodeMirror/lib/codemirror.css"> 

<link rel="stylesheet" type="text/css" href="CodeMirror/theme/abcdef.css"> 
<link rel="stylesheet" type="text/css" href="CodeMirror/theme/base16-dark.css"> 

<script src="CodeMirror/lib/codemirror.js"></script> 

<!-- EDIT missing the following file --> 
<script src="CodeMirror/mode/javascript/javascript.js"></script> 

<script src="CodeMirror/addon/edit/matchbrackets.js"></script> 
<script src="CodeMirror/addon/comment/continuecomment.js"></script> 

<script src="CodeMirror/addon/runmode/colorize.js"></script> 

<script src="CodeMirror/addon/hint/javascript-hint.js"></script> 
<script src="CodeMirror/addon/hint/html-hint.js"></script> 
<script src="CodeMirror/addon/hint/css-hint.js"></script> 
<script src="CodeMirror/addon/hint/anyword-hint.js"></script> 
<script src="CodeMirror/addon/hint/sql-hint.js"></script> 
<script src="CodeMirror/addon/lint/lint.js"></script> 

<script src="CodeMirror/keymap/sublime.js"></script> 
+0

您加载并启用语言模式吗?即加载实现你正在使用的语言的脚本,并设置'mode'选项。 (并确保在初始化编辑器之前已经加载了模式脚本。) – Marijn

+0

感谢Marijn寻求帮助。我用我的代码编辑我的帖子。我尝试过使用各种模式而没有成功。我无法理解我的代码中是否有问题或缺少一些CodeMirror文件。 – josei

+0

我在那里的任何地方都看不到'CodeMirror/mode/javascript/javascript.js'。 – Marijn

回答

1

您是否加载并启用语言模式?即加载实现您正在使用的语言的脚本,并设置模式选项。 (并且确保在初始化编辑器之前已经加载了模式脚本。)