软件介绍
CodeMirror是一款功能强大的代码编辑软件。CodeMirror采用功能强大、可组合的语言模式系统，提供100多种语言模式和各种插件，为用户实现更高级的代码编辑功能。
功能介绍
对100多种语言的现成支持一个强大的可组合的语言模式系统
自动完成(XML)
代码折叠
可配置的密钥绑定
Vim、Emacs和Sublime文本绑定系统
搜索和替换界面
匹配支架和标签。
支持拆分视图
衬胶机一体化
混合字体大小和样式
各种主题
调整大小以适应内容。
嵌入和阻止小部件
可编程沟
使文本范围成为风格化、只读或原子化的文本范围。
双向文本支持
许多其他方法和附加组件.....
格式教程
1.首先使用npm安装sql格式化程序插件。npm安装-保存SQL-格式化程序
2.然后介绍sql-formatter.js文件。
从“sql-formatter”导入sqlFormatter
3.接下来，对需要格式化的代码调用这个方法就可以了。
/*代码格式*/
format()& # 123；
/*获取文本编辑器内容*/
让sqlContent =
sqlContent = this . editor . getvalue()；
/*格式化sql内容并将其放入编辑器*/
this . editor . setvalue(SQL formatter . format(sqlContent))；
}
4.以下截图是格式化前后的区别。
施用方式
下载后解压文件夹，核心库和核心css放在lib下，支持的各种语言的语法定义放在mode下，支持的主题样式放在theme目录下。一般在开发中，在lib和mode下添加引用就够了。如何使用
使用代码镜像时，必须介绍以下两项:
下一个引用是对应于mode目录下的编辑器中要编辑的语言的js文件。这里，以Groovy为例:
如果想让Java代码支持代码高亮，需要引入我从网上下载的clike.js(我已经放在我的GitHub里了)。
引用的文件用于支持相应语言的语法高亮显示。
然后我前面说了，我第一次进Code Mirror官网，觉得那些编辑很丑。那可能是因为主题很丑。我在这里推荐一个不错的题材，简单介绍如下:
如果您仍然希望您的编辑器支持代码行折叠，请遵循以下步骤:
要是当初是这样推出的就好了，当然不是。
创建编辑器
在实际项目中，一般不会直接将整个正文内容作为编辑器的容器。最常用的方法是使用textarea。这里我在房间里使用了一个文本区域，
下一步是创建编辑器。
Http://根据DOM元素的id构造编辑器
var editor = Code mirror . fromtextarea(document . getelementbyid(" Code ")，& # 123；
});
是不是有点单调？
可以，我还可以在里面给他设置一些属性:(充分利用我开头介绍的文件)
模式:“text/groovy”，http://实现groovy代码高亮
模式:“text/x-java”，http://实现java代码高亮
LineNumbers: true，http://显示行号
主题:《德古拉》，http://设置主题
换行:true，http:// Code folding
foldGutter:没错，
gutters:[" Code mirror-line numbers "，" CodeMirror-foldgutter"]，
match括号:true，http://括号匹配。
Http://readO nly: true，http:// read-only
如果需要查看更多属性，可以去官网找。目前我只用这些属性！
以下是一些例子:
IndentUnit:整数缩进单位，值为空格数，默认值为2。
SmartIndent:布尔自动缩进，设置是否根据上下文自动缩进(与上一行缩进量相同)。默认值为true。
制表符大小:整数制表符的宽度，默认为4。
IndentWithTabs: boolean，缩进时，n *制表符宽度空格是否需要用n个制表符替换。默认值为false。
ElectricChars: boolean当输入可能改变当前缩进时是否再次缩进。默认值为true(仅当mode支持缩进时有效)。
SpecialChars: RegExp是需要用占位符替换的特殊字符的正则表达式。最常用的字符是非印刷字符。默认为:/[\ u 0000-\ u 0019 \ u00ad \ u200b-\ u200f \ u 2028 \ u 2029 \ u efff]/。
SpecialCharplaceholder:function(char)→element这是一个接收由specialChars选项指定的字符作为参数的函数。这个函数将生成一个DOM节点，用来显示指定的字符。默认情况下，红点(？)，这个红点有一个提示框，前面有一个特殊的字符码。
rtlMoveVisually: boolean确定光标在从右向左(阿拉伯语、希伯来语)文本中的水平移动是可视的(按左箭头将光标向左移动)还是逻辑的(按左箭头将移动到字符串中下一个较低的索引，在从右向左的文本中，该索引在视觉上是向右的)。缺省值在windows上为false，在其他平台上为true。(我也不知道这一段是什么鬼。)
KeyMap:字符串配置快捷键。默认值为default，由Codemorrir.js在其他键映射目录下内部定义。
ExtraKeys: object用一个不同于以前的键映射配置的快捷键绑定编辑器。
LineWrapping: boolean当行很长时，文本是换行还是滚动。默认为滚动。
LineNumbers: boolean是否在编辑器左侧显示行号。
首行号:整数行号从哪个号开始，默认值为1。
line formatter:function(line:integer)→String使用函数设置行号。
Gutters: array用于添加额外的间距(在行号间距之前或代替行号间距)。该值应该是CSS名称的数组，每个项目定义用于绘制装订线背景的宽度(和可选背景)。为了显式设置行号间距的位置(默认情况下在所有其他间距的右侧)，还可以包含CodeMirror-linenumbers类。类名是用于传递给setGutterMarker的键名(keys)。
Fixedgutter: boolean设置装订线是随编辑器内容水平滚动(false)还是固定在左侧(true或default)。
string设置滚动条。默认为“native”，显示本机滚动条。核心库还提供了“空”样式，完全隐藏滚动条。插件可以设置更多的滚动条模式。
CoverterNextScrollBar: Boolean当启用了fixedgutter并且有水平滚动条时，默认情况下，gutter将显示在滚动条的最左侧。当此项设置为true时，Gutter将被具有CodeMirror-gutter-filler类的元素遮挡。InputStyle: string选择CodeMirror如何处理输入和焦点。核心库定义了textarea和contenteditable输入模式。在移动浏览器上，默认为contenteditable，在桌面浏览器上，默认为textarea。更好地支持内容可编辑模式下的IME和屏幕阅读器。
Read Only: boolean|string编辑器是否为只读。如果设置为预设值“nocursor”，编辑区除了只读外无法获得焦点。
ShowCursorWhenselecting:Boolean选择时是否显示光标；默认值为false。
WiseCopyCut:启用Boolean时，如果复制或剪切时没有选择文本，光标所在的整行都会被自动操作。
撤销深度:整数撤销次数的最大值，默认为200(包括选中的内容变化事件)。
HistoryEventDelay:整数在输入或删除期间引发历史事件之前的毫秒数。
Tabindex:整数编辑器的Tabindex。
auto focus:boolean是否在初始化时自动获得焦点。这种情况默认是关闭的。但是，当使用textarea并且没有显式指定该值时，它将自动设置为true。
DragDrop: boolean是否允许拖放，默认值为true。
AllowDropFileTypes:默认情况下，数组为空。设置此项时，只有包含在该数组中的文件类型被接收并拖动到编辑器中。文件类型是MIME名称。
CursorBlinkRate:数字光标闪烁的间隔，以毫秒为单位。默认值为530。设置为0时，光标闪烁被禁用。负数隐藏光标。
CursorScrollMargin:当光标位于可视区域边界附近时的数字，即光标与顶部和底部之间的距离。默认值为0。
CursorHeight:数字光标高度。默认值为1，即全行高。对于某些字体，设置0.85看起来更好。
ReselectionContextMenu: Boolean设置在选定文本外部单击以打开上下文菜单时，是否将光标移动到单击点。默认值为true。
WorkTime，workDelay: number通过一个假的后台线程突出显示工作时间持续时间，然后使用timeout来休息workDelay持续时间。默认值为200和300。(我不知道这个函数在说什么)
PollInterval: number表示CodeMirror滚动(写入数据)到相应textarea的速度(获得焦点时)。大部分输入是由事件捕获的，但有些输入法(如IME)在某些浏览器中不生成事件，所以使用数据滚动。默认值为100毫秒。
默认情况下，CodeMirror会将两个使用相同类的span合并为一个。将此项设置为false可禁用此功能。
AddModeClass: boolean启用时(默认禁用)，一个以cm-m开头的额外CSS样式类(代表生成标签的模式)将被添加到每个标签中。例如，XML模式生成的标记将添加cm-m-xml类。
MaxHighlightLength: number当一个很长的行需要突出显示时，为了保持响应性，编辑器在到达某些位置时会直接将其他行设置为纯文本。默认值为10000，可以设置为无穷大来关闭该功能。
ViewportMargin: integer指定当前在视图内容上下滚动的要呈现的行数。这会影响滚动时要更新的行数。通常，应该使用默认值10。您可以将该值设置为无穷大，以便始终呈现整个文档。注意:此设置会影响处理大型文档时的性能。
