How do I syntax highlight code for a specific language using codemirror.
my html looks like this:
<head>
<link rel="stylesheet" type="text/css" href="codemirror/lib/codemirror.css">
</head>
<body>
<textarea class="codetextarea"></textarea>
<!-- javascript files-->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"> </script>
<script type="text/javascript" src="codemirror/lib/codemirror.js"></script>
<script type="text/javascript" src="js/default.js"></script>
</body>
And my javascript:
$(document).ready(function() {
var code = $(".codetextarea")[0];
var editor = CodeMirror.fromTextArea(code, {
lineNumbers : true,
});
});
codemirror
is the directory of codemirror API.
I want to do syntax highlighting for C++ but I don't know how to.
Just add the language in the configuration of your editor ;)
The mode
parameter is what you're looking for I think.
Example from the official website for C++:
var cppEditor = CodeMirror.fromTextArea(document.getElementById("cpp-code"), {
lineNumbers: true,
matchBrackets: true,
mode: "text/x-c++src"
});
Check the sources from this page for C++: http://codemirror.net/mode/clike/index.html
This page lists all the supported languages: http://codemirror.net/mode/index.html
Edit:
I must admit that their documentation is quite unclear to find what you want to in it.
Did you try to add this file to your webpage: http://codemirror.net/mode/clike/clike.js
? I think this is mandatory, check the imports in the first page I mentionned above, you probably miss a module.