shikijs / shiki

A beautiful yet powerful syntax highlighter
http://shiki.style/
MIT License
9.92k stars 362 forks source link

Load raw theme synchronously #175

Closed pomber closed 8 months ago

pomber commented 3 years ago

If I already have a highlighter and want to load a new raw theme (no fetching required) it would be great if I could do it without awaiting.

Currently, I need to do:

import rawTheme from "shiki/themes/poimandres.json"

function async someFunction(highlighter) {
  ...
  await highlighter.loadTheme(rawTheme)  // <= async
  const lines =  highlighter.codeToThemedTokens("some code", "js", rawTheme.name)
}

As far as I understood shiki's code, loadTheme is async only for the case when it needs to fetch the theme. Maybe there could be a different sync method for raw themes:

import rawTheme from "shiki/themes/poimandres.json"

function async someFunction(highlighter) {
  ...
  highlighter.loadRawTheme(rawTheme)  // <= sync
  const lines =  highlighter.codeToThemedTokens("some code", "js", rawTheme.name)
}

Even better (for me) would be to be able to pass themes that aren't loaded directly to codeToThemedTokens.

import rawTheme from "shiki/themes/poimandres.json"

function async someFunction(highlighter) {
  // third param is a raw theme that isn't in the registry
  const lines =  highlighter.codeToThemedTokens("some code", "js", rawTheme) 
}

Probably the same applies to the loadLanguage method and 'lang' parameter.

orta commented 3 years ago

Yeah, I think highlighter.loadThemeSync could work and emulate's the normal node pattern?

antfu commented 8 months ago

With v1.0, you can directly pass the raw theme object as the value of theme, which I think should cover your use case.