svelte-lowlight

svelte-prism for Lowlight.

Installation

pnpm i svelte-lowlight highlight.js

Example Usage

<script lang="ts">
  // Register the language(s) you want to use
  // For performance, you should prob move this to your svelte layout, ideally in a context="module" script tag - however this also works, at the cost of a small amount of performance
  import { lowlight } from 'svelte-lowlight'; // The lowlight instance
  import js from 'highlight.js/lib/languages/javascript';
  lowlight.register({ js });

  // Import the component
  import Lowlight from 'svelte-lowlight';

  // Import the theme
  import 'highlight.js/styles/tokyo-night-dark.css';
</script>

<Lowlight
  source={`// hello!
console.log('HLELO');
`}
/>