v1.2.0 Released: Nano Editor & Redirection Included!

The embedded terminal
for Svelte.

A fully typed, highly customizable, zero-dependency terminal component. Build interactive CLI tutorials, devtools, or developer portfolios with incredible aesthetics.

guest@svelte-bash:~
user@host ~ $

Get Started in Seconds

Zero dependencies. Fully typed. Instant integration.

1 Installation

Install the package via npm. It has zero external dependencies other than Svelte itself.

npm install svelte-bash

2 Basic Usage

Import the component and pass a structure object to define your virtual file system.

<script>
  import { Terminal } from 'svelte-bash';

  const files = {
    'readme.md': '# Hello World',
    'src': {
       'app.js': 'console.log("Hi")'
    }
  };
</script>

<Terminal
    structure={files}
    user="alice"
    style="height: 300px"
/>

Powerful Web-Scale Features

Everything you need to deliver a breathtaking CLI experience in the browser.

Nano Editor & Redirection

It's not just a read-only prop. Redirect outputs to files using >. Edit them visually using the beautifully embedded nano clone.

user@host ~ $

Bootplay Engine

Simulate rapid boot sequences or server startup logs with the ultra-fast bootplay engine.

user@host ~ $

Zero-Config Persistence

Pass a single string to the persist prop and your filesystem state mathematically synchronizes with localStorage securely.

<Terminal
  persist="my-app-fs"
/>

Programmatic Commands & Aliases

Extend the terminal dynamically. Inject async callbacks. Map complex commands to short snippets using aliases.

user@host ~ $

Engineered for Developers

PropertyTypeScript TypeDefault Value
structureFileStructure{}
commandsRecord<string, CommandHandler>{}
theme'dark' | 'light' | 'matrix' | 'dracula' | Theme'dark'
persiststringundefined
bootplaystring[]undefined
autoplayAutoplayItem[]undefined
Engineered with ♥️ for the Svelte Community by YusufCeng1z.