Svelte Rune Highlight

![CI](https://github.com/shinokada/svelte-rune-highlight/actions/workflows/ci.yml)
![npm version](https://www.npmjs.com/package/svelte-rune-highlight)
![License](https://github.com/shinokada/svelte-rune-highlight/blob/main/LICENSE)

DEMO

Syntax highlighting for Svelte using highlight.js.
This lib is ported from Svelte-Highlight.

> 📦 v2.0 Breaking Changes
> Tailwind CSS classes have been removed from library components. The library is now completely CSS framework-agnostic.
> See MIGRATION.md for upgrade instructions.

Installation

``sh pnpm i -D svelte-rune-highlight highlight.js`

Then in +layout.svelte

`svelte`

or use directly from cdnjs

`svelte rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.11.1/styles/dark.min.css" />`

`Docs`

Docs

`Highlight component`

Highlight

`HighlightAuto component`

HighlightAuto

`HighlightSvelte component`

HighlightSvelte

`Line numbers`

Line numbers

`HighlightCompo Component`

HighlightCompo Component

`Wrappers`

Wrappers

`Theme Selector`

Theme Selector

`Development`

`$3`

We use Vitest for unit testing and Playwright for E2E testing.

`bash

`Run all tests`


pnpm test
Run tests in watch mode

pnpm test:watch
Run tests with coverage

pnpm test:coverage
Open test UI

pnpm test:ui


See TESTING.md for detailed testing guide.
$3

Contributions are welcome! Please ensure: 1. All tests pass:pnpm test2. Code is formatted:pnpm format3. No linting errors:pnpm lint4. Types check:pnpm check`

Credit

Svelte-Highlight