A plug is a self-contained JavaScript bundle (*.plug.js) that extends SilverBullet. It runs inside a sandboxed Web Worker, talks to the editor via API|syscalls, and hooks into SilverBullet through commands, events, slash commands, message queues, and more.
A big chunk of SilverBullet itself is implemented as a mix of Space Lua and built-in plugs, so it’s also worth exploring built-in plugs source code to get a feel for how things work.
This section covers the basics to build, test, and distribute your own plug:
*.plug.yaml manifests, hook types, and the syscall catalogThe easiest way to start is to click the “Use this template” button on the silverbullet-plug-template repo. Then:
npm install
npm run build
This produces a yourplug.plug.js bundle. For development, copy somewhere in your Space (it doesn’t really matter where):
cp yourplug.plug.js ~/myspace/
Within a few seconds watch your browser’s JavaScript console — the plug file should be synced locally. You can now run the Plugs: Reload command to “hot” reload it, without a full page.
A minimal plug consists of two files: a YAML manifest and the TypeScript source it references.
hello.plug.yaml
name: hello
functions:
helloCommand:
path: "./hello.ts:helloCommand"
command:
name: "Hello: World"
hello.ts
import { editor } from "@silverbulletmd/silverbullet/syscalls";
export async function helloCommand() {
await editor.flashNotification("Hello, world!");
}
Build, copy into your space, plug reload, and a Hello: World should now be available as a command from the Command Palette. When it’s run you should see a “Hello world!” message flash.
From here, read Plugs/Development/Architecture to understand what’s happening under the hood, then Plugs/Development/Reference for the full manifest/hook/syscall surface.