在线代码编辑器视图

如果在页面中包含 CodeMirror，则可以使用 CodeMirror 进行 Codeview。使用 Summernote 包含 jQuery、Bootstrap 和 CodeMirror。

```html

<link href="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet"> 
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script> 
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>

<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.css">
<link rel="stylesheet" type="text/css" href="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/theme/monokai.css">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/codemirror.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/3.20.0/mode/xml/xml.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/codemirror/2.36.0/formatting.js"></script>

<link href="summernote.css">
<script src="summernote.js"></script>
```

使用 codemirror 选项初始化 Summernote。

```javascript
$('.summernote').summernote({
  height: 150,   //set editable area's height
  codemirror: { // codemirror options
    theme: 'monokai'
  }
});
```

[CodeMirror](https://codemirror.net/ "CodeMirror")是一款使用 JavaScript 实现的浏览器通用文本编辑器。它专门用于编辑代码，并带有多种语言模式和可实现更高级编辑功能的附加组件。