LumisDocs
Recipes

Local WASM bundle

Load a whole bundle of parser packages in a browser.

A bundle package depends on its language packages and imports each one the first time it is loaded, so a bundler splits every parser into its own chunk.

import {createHighlighter} from '@lumis-sh/lumis'
import {htmlInline} from '@lumis-sh/lumis/formatters'
import latte from '@lumis-sh/themes/catppuccin_latte'
import web from '@lumis-sh/wasm-bundle-web'

const hl = await createHighlighter({languages: [web]})

await hl.loadLanguage(web.javascript)

const html = hl.highlight(
  'const theme = "catppuccin-latte"',
  htmlInline({language: web.javascript, theme: latte})
)

See Where parsers come from.