Repository files navigation

debug.js implementation for Svelte SPA, SSR and sveltekit static sites. See your debug statements in the browser.

• svelte server side rendering (SSR) friendly.
• works with sveltekit SPA, SSR and static site adapters.
• auto scrolls to the last entry.
• typescript definitions are included for LSP.

svelte-debug-console demo

# install as a development dependencypnpm install -D svelte-debug-console

Import the library onto your template:

import{Debug}from"svelte-debug-console";/* │Debug: svelte <Debug> component. */

In your parent component, add the<Debug>:

<Debugdiscard={"false"} />

If you want to start fresh, setdiscard option to true.

By default, debug.js will only create a single instance across your application.svelte-debug-console will inject itself into the main debug instance.

For some use cases, this may not be desired.

If any trouble, please create an issue. PRs are most welcome.

• Add CSS variables to allow console customization
• Improve line formatting to distinct between the message and the label. (probably an arrow or something in between)
• Add copy to clipboard option
• Add filtering and search