eleventy-plugin-syntaxhighlighting-chroma

WIP WIP WIP WIP WIP WIP

A module for handling syntax highlighting in Eleventy using Chroma; a syntax highlighter written in Go. There is no browser/client JavaScript required, the highlight transformations are all done at build-time.

I am making using of the chroma-highlight NPM package to include Chroma support. (It handles downloading the required binary for the platform you are working on).

This module/plugin took the 11ty plugin eleventy-plugin-syntaxhighlight as the basis.

Supported args in code blocks

The first argument is always expected to be the language, at present there is no bugout/fail if a language is not provided first. (Nor in the original plugin)

For Markdown, separate arguments with a /, this seems to be hard coded somewhere and I haven't a workaround yet. For liquid and njk use spaces ( ) to separate arguments.

Arguments:

• lineNumbers will add line numbers starting from 1 for each code block.
• lineNumbersStyle if table is used, then code block will use a table to make it easier to drag and select the code. i.e lineNumberStyle=table
• lineNumbersStart the number to start the line number count from. i.e lineNumbersStart=200
• number or number, number or number,rangeStartNumber-rangeEndNumber or number,rangeStartNumber-rangeEndNumber to specify a line or lines to highlight. i.e 1, or 1,3, or 3:6, or 1,3:6, or 2,4-6. NOTE if you specify lineNumbersStart then the specified numbers must be relative to that (so lineNumbersStart=200, then use 204 to highlight line 204)

Supported options in eleventy config

You can specify some arguments in the options object in .eleventy.js config. Options are considered defaults, and can be overriden by codeblock arguments.TODO

Example of options object

options
{
  theme: 'onedark',
  lineNumbers: false,
}

Theme can be set to one of these themes. If no theme is specified, then xcode-dark is used.

• lineNumbers will add line numbers starting from 1 for each code block.
• lineNumbersStyle if table is used, then code block will use a table to make it easier to drag and select the code.