roommirror
v0.0.9
Published
Syntax highlight code blocks that is generated from Markdown with CodeMirror.
Downloads
21
Maintainers
Readme
RoomMirror
Syntax highlight code blocks generated from Markdown with CodeMirror.
doc in japanese
install
npm install roommirror
usage
common settings
path to codemirror
is "roommirror_root/node_modules/codemirror"
<link rel="stylesheet" href="codemirror/lib/codemirror.css">
and theme files...
<link rel="stylesheet" href="codemirror/theme/base16-dark.css">
<link rel="stylesheet" href="codemirror/theme/solarized.css">
<link rel="stylesheet" href="codemirror/theme/monokai.css">
in browser
<script src="browser/roommirror.js"></script>
or exclude CodeMirror...
<script src="path/to/codemirror.js"></script>
<script src="browser/rm_without_cm.js"></script>
and mode files...
<script src="codemirror/mode/htmlmixed/htmlmixed.js"></script>
<script src="codemirror/mode/javascript/javascript.js"></script>
<script src="codemirror/mode/css/css.js"></script>
in browserify
var RoomMirror = require('roommirror');
// and mode files...
require('codemirror/mode/htmlmixed/htmlmixed.js');
require('codemirror/mode/javascript/javascript.js');
require('codemirror/mode/css/css.js');
RoomMirror(qs) -> [CodeMirror]
- parameter qs: css selector of elements you want syntax highlighting.
- return [CodeMirror]: array of codemirror instances that highlighted code blocks.
RoomMirror.byAnnotation(qs) -> [CodeMirror]
- parameter qs: css selector of previous elements you want syntax highlighting.
<p class="rm-a" data-eval="{ mode: 'javascript' }"></p>
<div>var test = 'test';</div>
- return [CodeMirror]: array of codemirror instances that highlighted code blocks.
example for markdown
in markdown...
<p class="rm-a" data-eval="{ mode: 'javascript', lineNumbers: true }"></p>
var test = 'test';
var add = function(a, b) {
return a + b;
};
[0, 1, 2, 3, 4].reduce(add, 0); // 10
generate to html...
<p class="rm-a" data-eval="{ mode: 'javascript', lineNumbers: true }"></p>
<pre><code>var test = 'test';
var add = function(a, b) {
return a + b;
};
[0, 1, 2, 3, 4].reduce(add, 0); // 10</code></pre>
syntax highlighting
var roommirrors = RoomMirror.byAnnotation('.rm-a');
##demo
in myblog: メモを揉め