CodeMirror 不显示 HTML 模式

Question

我正在尝试在我的 Web 应用程序中使用 CodeMirror 模式，但它不会突出显示模式 "htmlmixed" 的文字。我不明白出了什么问题。每个文件的路径都是正确的，因为我没有收到任何 404 错误。这是我所做的：

<!DOCTYPE html>
<head>
    <script src="/node_modules/codemirror/lib/codemirror.js"></script>           
    <link rel="stylesheet" href="/path-to/codemirror/lib/codemirror.css">
   <script src="/path-to/codemirror/lib/codemirror.js"></script>
   <script src="/path-to/codemirror/mode/htmlmixed/htmlmixed.js"></script>
   <script src="/path-to/jquery.min.js"></script>
</head>
<html>
    <textarea id="editor"></textarea>
    ....
</html>
<script>
    var editor = CodeMirror.fromTextArea(document.getElementById("editor"), {
         lineNumbers: true,
         mode:  "htmlmixed",
         htmlMode: true,
});
</script>

如有任何帮助，我们将不胜感激！

谢谢！

Answer 1

htmlmixed模式依赖于xml、javascript、css模式。必须包含它们才能使 htmlmixed 正常工作。

这是一个例子：

var editor = CodeMirror.fromTextArea(document.getElementById("editor"), {
  lineNumbers: true,
  mode:  "htmlmixed",
  htmlMode: true,
});

<head>
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/codemirror.css" />
  <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/codemirror.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/mode/htmlmixed/htmlmixed.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/mode/xml/xml.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/mode/javascript/javascript.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.41.0/mode/css/css.js"></script>
</head>
<html>
  <textarea id="editor">&lt;p&gt; I am HTML&lt;/p&gt;
&lt;script&gt;
  console.log(&quot;I am JS&quot;);
&lt;/script&gt;</textarea>
</html>

CodeMirror 不显示 HTML 模式

CodeMirror Doesn't Display HTML Mode

html

javascript

css

jquery

codemirror