https://github.com/basaran/svelte-debug-console

debug.js implementation for Svelte SPA, SSR and sveltekit static sites. See your debug statements in the browser.
https://github.com/basaran/svelte-debug-console

debug ssr svelte sveltekit

Last synced: about 5 hours ago
JSON representation

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

• Host: GitHub
• URL: https://github.com/basaran/svelte-debug-console
• Owner: basaran
• Created: 2021-10-22T03:53:35.000Z (about 3 years ago)
• Default Branch: main
• Last Pushed: 2021-11-04T21:24:28.000Z (about 3 years ago)
• Last Synced: 2023-12-25T11:29:04.022Z (11 months ago)
• Topics: debug, ssr, svelte, sveltekit
• Language: JavaScript
• Homepage: https://basaran.github.io/svelte-recaptcha-v2/
• Size: 8.79 KB
• Stars: 10
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
![svelte-debug-console](https://user-images.githubusercontent.com/30809170/138386188-96731e4f-4992-4efa-b4e5-a9a7d736df2c.png)

# svelte-debug-console

[debug.js](https://github.com/visionmedia/debug)  implementation for Svelte SPA, SSR and  sveltekit static sites. See your debug statements in the browser.

## Features

 - [x] svelte server side rendering (SSR) friendly.

 - [x] works with sveltekit SPA, SSR and static site adapters.

 - [x] auto scrolls to the last entry.

 - [x] typescript definitions are included for LSP.

## Demonstration

[svelte-debug-console demo](https://basaran.github.io/svelte-recaptcha-v2/)

## Getting Started

```bash

# install as a development dependency

pnpm install -D svelte-debug-console

```

## Basic Usage

Import the library onto your template:

```js

import { Debug } from "svelte-debug-console";

/*

 │Debug: svelte  component.

 */

```

In your parent component, add the ``:

```svelte

```

If you want to start fresh, set `discard` 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.

## Issues

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

## Todo

- [ ] 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