api reference

# language support § 01

Currently twinkleplop only supports a handful of languages.

Check the GitHub issues for planned languages. File an issue if yours isn't listed.

# loading languages § 02

Languages are self contained packages. You can simply install and import the ones you need.

Embedded languages are an implementation detail of the language, you don't need to think about them.

import { language } from '@twinkleplop/html';

const html_highlighter = language();

// highlight some code, CSS and JS work
const html = html_highlighter("<script>1 + 2</script>");

If you want raw tokens, you can use the tokenizer export:

import { tokenizer } from '@twinkleplop/html';

const html_tokenizer = tokenizer();

// get some tokens
const tokens = html_tokenizer("<p>hello world</p>");

# multiple languages § 03

Using two languages is a little bit like using one, except you do it twice:

import { language as make_html } from '@twinkleplop/html';
import { language as make_ts } from '@twinkleplop/typescript';

const html = make_html();
const ts = make_ts();

// highlight some code, CSS and JS work
const html = html("<script>1 + 2</script>");
const ts = ts("1 + 2");

In this example we import the typescript and html languages. html uses typescript internally, but we don't pay for it twice, any modern bundler will deduplicate internal imports as they point to the same thing.

Twinkleplop has modern ESM output with granular imports and exports at all sensible boundaries. This works very nicely with bundlers like Vite. No additional gymnastics required.

# lazy loading § 04

Twinkleplop does not have a custom module loading API, you can simply use your bundler's native dynamic import capabilities.

const langs = {
  ts: () => import('@twinkleplop/typescript'),
  html: () => import('@twinkleplop/html'),
}

async function get_lang(lang) {
  return (await langs[lang]()).language();
}

// later
const ts = await get_lang("ts");
const html = await get_lang("html");

This will create chunks for each language so they can be loaded and initialised on demand.