0.0.9 • Published 9 years ago
roommirror v0.0.9
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: メモを揉め