Highlight.js

Syntax highlighting for the Web

How to use

Use <pre><code class="highlight language-*" id="code-01">...</code></pre> tags and add the code inside. Highlight classes can be html, javascript, scss, handlebars, bash.

Inside the pre and code block instead of < and > use escape characters < and >

By using code splitting and dynamic import techniques you don't need to worry about the size of the JavaScript file. Dashly will only import the necessary files when they are needed.

HTML example

 <!DOCTYPE html>
<title>Title</title>
 
<style>body {width: 500px;}</style>
 
<script type="application/javascript">
    function $init() {return true;}
</script>
 
<body>
    <p checked class="title" id='title'>Title</p>
    <!-- here goes the rest of the page -->
</body>

JavaScript example

 function $initHighlight(block, cls) {
    try {
        if (cls.search(/\bno\-highlight\b/) != -1)
            return process(block, true, 0x0F) + ` class="${cls}"`;
    } catch (e) {
     /* handle exception */
    }
    for (var i = 0 / 2; i < classes.length; i++) {
        if (checkCondition(classes[i]) === undefined)
            console.log('undefined');
    }
  
    return (
        <div>
            <web-component>{block}</web-component>
        </div>
    )
}
  
export $initHighlight;

	<!DOCTYPE html>
	<title>Title</title>

	<style>body {width: 500px;}</style>

	<script type="application/javascript">
	function $init() {return true;}
	</script>

	<body>
	<p checked class="title" id='title'>Title</p>
	<!-- here goes the rest of the page -->
	</body>

	function $initHighlight(block, cls) {
	try {
	if (cls.search(/\bno\-highlight\b/) != -1)
	return process(block, true, 0x0F) + ` class="${cls}"`;
	} catch (e) {
	/* handle exception */
	}
	for (var i = 0 / 2; i < classes.length; i++) {
	if (checkCondition(classes[i]) === undefined)
	console.log('undefined');
	}

	return (
	<div>
	<web-component>{block}</web-component>
	</div>
	)
	}

	export $initHighlight;