README.md

Luna Syntax Highlighter

Syntax highlighter using highlightjs.

Demo

https://luna.liriliri.io/?path=/story/syntax-highlighter

Install

Add the following script and style to your page.

<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/luna-text-viewer/luna-text-viewer.css" />
<link rel="stylesheet" href="//cdn.jsdelivr.net/npm/luna-syntax-highlighter/luna-syntax-highlighter.css" />
<script src="//cdn.jsdelivr.net/npm/luna-text-viewer/luna-text-viewer.js"></script>
<script src="//cdn.jsdelivr.net/npm/luna-syntax-highlighter/luna-syntax-highlighter.js"></script>

You can also get it on npm.

npm install luna-syntax-highlighter luna-text-viewer --save

import 'luna-text-viewer/luna-text-viewer.css'
import 'luna-syntax-highlighter/luna-syntax-highlighter.css'
import LunaSyntaxHighlighter from 'luna-syntax-highlighter'

Usage

const syntaxHighlighter = new LunaSyntaxHighlighter(container)
syntaxHighlighter.setOption({
  code: 'const a = 1;',
  language: 'javascript',
})

Configuration

• code(string): Code to highlight.
• language(string): Language to highlight code in.
• maxHeight(number): Max viewer height.
• showLineNumbers(boolean): Show line numbers.
• wrapLongLines(boolean): Wrap lone lines.

Api

static getLanguage(name: string): any

Highlight.js getLanguage.

static registerLanguage(name: string, fn: AnyFn): void

Highlight.js registerLanguage.