shikijs / twoslash

You take some Shiki, add a hint of TypeScript compiler, and 🎉 incredible static code samples
https://shikijs.github.io/twoslash/
MIT License
1.08k stars 54 forks source link

Plugin breaks with `@11ty/eleventy@3.0.0` #193

Open KiwiKilian opened 11 months ago

KiwiKilian commented 11 months ago

Loading with deasync breaks in @11ty/eleventy@3.0.0. With the new ESM support by Eleventy the plugin could boil down to this:

import { setupForFile, transformAttributesToHTML } from 'remark-shiki-twoslash';

/**
 * @param {*} eleventyConfig
 * @param {import("shiki-twoslash").UserConfigSettings} options
 */
export default async function (eleventyConfig, options = {}) {
  const { highlighters } = await setupForFile(options);

  eleventyConfig.addMarkdownHighlighter((code, lang, fence) => {
    code = code.replace(/\r?\n$/, ''); // strip trailing newline fed during code block parsing
    return transformAttributesToHTML(code, [lang, fence].join(' '), highlighters, options);
  });
}

Note this would drop support for versions below 11ty/eleventy@3.0.0, therefore I'm not sure if I should create a PR? Otherwise #189 might be a solution, independent of the Eleventy version.

olets commented 1 month ago

Thanks for sharing that solution. I've made a fork which uses it to support Eleventy 3: @olets/eleventy-plugin-shiki-twoslash. My fork also has the latest Shiki themes and languages.