Obviously, this is supposed to work only for code blocks (<pre><code>
) and not for inline code.
By default the plugin trims all leading and trailing whitespace of every code block. It also removes extra indents and trailing whitespace on every line.
The plugin can be disabled for a particular code block by adding the class no-whitespace-normalization
to
either the <pre>
or <code>
tag.
The default settings can be overridden with the setDefaults()
method
like so:
Prism.plugins.NormalizeWhitespace.setDefaults({
'remove-trailing': true,
'remove-indent': true,
'left-trim': true,
'right-trim': true,
/*'break-lines': 80,
'indent': 2,
'remove-initial-line-feed': false,
'tabs-to-spaces': 4,
'spaces-to-tabs': 4*/
});
The following settings are available and can be set via the data-[setting]
attribute on the <pre<
element:
The following example demonstrates the use of this plugin:
The result looks like this:
var example = {
foo: true,
bar: false
};
var
there_is_a_very_very_very_very_long_line_it_can_break_it_for_you
= true;
if
(there_is_a_very_very_very_very_long_line_it_can_break_it_for_you
=== true) {
};
It is also compatible with the keep-markup plugin:
@media screen {
div {
text-decoration: underline;
background: url('foo.png');
}
}
This plugin can also be used on the server or on the command line with Node.js:
var Prism = require('prismjs');
var Normalizer = require('prismjs/plugins/normalize-whitespace/prism-normalize-whitespace');
// Create a new Normalizer object
var nw = new Normalizer({
'remove-trailing': true,
'remove-indent': true,
'left-trim': true,
'right-trim': true,
/*'break-lines': 80,
'indent': 2,
'remove-initial-line-feed': false,
'tabs-to-spaces': 4,
'spaces-to-tabs': 4*/
});
// ..or use the default object from Prism
nw = Prism.plugins.NormalizeWhitespace;
// The code snippet you want to highlight, as a string
var code = "\t\t\tvar data = 1; ";
// Removes leading and trailing whitespace
// and then indents by 1 tab
code = nw.normalize(code, {
// Extra settings
indent: 1
});
// Returns a highlighted HTML string
var html = Prism.highlight(code, Prism.languages.javascript);