lowlight
Virtual syntax highlighting for virtual DOMs and non-HTML things,
with language auto-detection. Perfect for React, VDOM, and
others.
Lowlight is built to work with all syntaxes supported by highlight.js,
thatβs 172 languages (and all 73 themes).
Table of Contents
Installation
npm:
npm install lowlight
Usage in the browser Β»
Usage
Highlight:
var low = require('lowlight');
var ast = low.highlight('js', '"use strict";').value;
Yields:
[ { type: 'element',
tagName: 'span',
properties: { className: [ 'hljs-meta' ] },
children: [ { type: 'text', value: '"use strict"' } ] },
{ type: 'text', value: ';' } ]
Or, stringified with rehype:
var rehype = require('rehype');
var html = rehype().stringify({type: 'root', children: ast}).toString();
Yields:
<span class="hljs-meta">"use strict"</span>;
Tip: Use hast-to-hyperscript
to transform
to other virtual DOMs, or DIY.
API
low.highlight(language, value[, options])
Parse value
according to the language
grammar.
Parameters
name
(string
) β See list of names and aliases;value
(string
) β Source to highlight;options
(Object?
, optional):
prefix
(string?
, default: 'hljs-'
) β Class prefix.
Returns
Object
:
relevance
(number
)
β Integer representing how sure low is the given code is in
the given language;language
(string
) β The given language
;value
(Array.<Node>
) β Hast nodes
representing the highlighted given code.
low.highlightAuto(value[, options])
Parse value
by guessing its grammar.
Parameters
value
(string
) β Source to highlight;options
(Object?
, optional):
prefix
(string?
, default: 'hljs-'
)
β Class prefix;subset
(Array.<string>?
, optional, defaults to
all registered languages.)
β List of allowed languages.
Returns
Object
:
relevance
(number
)
β Integer representing how sure low is the given code
is in the detected language;language
(string
) β The given language
;value
(Array.<Node>
) β Hast nodes
representing the highlighted given code.secondBest
(Object?
)
β Object with the same structure as the top returned object, but
containing information for the second-best result.
Can be null
.
low.registerLanguage(name, syntax)
Register a syntax. Useful in the browser or with custom grammars.
Parameters
name
(string
) β Name of language;syntax
(Function
) β Syntax highlighter, see
highlight.js
s docs for more information.
Browser
I do not suggest using the pre-built files or requiring lowlight
in
the browser as that would include a 530kb (170kb GZipped) file.
Instead, require lowlight/lib/core
, and include only the used
highlighters. For example:
var low = require('lowlight/lib/core');
var js = require('highlight.js/lib/languages/javascript');
low.registerLanguage('javascript', js);
low.highlight('js', '"use strict";');
...When using browserify, minifying this results in just 17kb of code
(7kb with GZip).
Projects
License
MIT Β© Titus Wormer