The Terminal
for Svelte.

A beautifully typed, file-system ready terminal component. Give your app a CLI power-user interface in minutes.

GitHub

user@svelte-bash x

guest@host ~ $

Installation

Get started by installing the package via npm. It has zero dependencies other than Svelte itself.

npm install svelte-bash

Basic Usage

Import the component and pass a structure object to define your 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" />

alice@host ~ $

Advanced Features

Custom Commands

Pass a commands object to handle custom logic. You can return a string, an array of lines, or even other Svelte components.

const cmds = { greet: (args) => `Hello ${args[0]}`, async: async () => { await fetch('/api'); return 'Done!'; } }; <Terminal commands={cmds} style="height: 300px" />

user@host ~ $

Autoplay / Show Mode

Great for tutorials. The terminal will type for you.

<Terminal autoplay={[ { command: 'git status' }, { command: 'git commit -m "wip"', output: '...' } ]} style="height: 300px" />

Deep Theming

Override standard colors with the theme prop.

<Terminal theme={{ background: '#282a36', prompt: '#ff79c6', cursor: '#f8f8f2' }} style="height: 300px" />