Create a plugin
Prefer the interactive scaffolder (it fills in id / name / icon and the optional backend, settings, database and lifecycle-hook parts):
pnpm create-pluginOr copy the template manually:
cp -r plugins/_template plugins/my-toolsThen edit plugins/my-tools/plugin.json:
{ "id": "my-tools", "name": "My tools", "tools": [ { "id": "my-tools-hello", "name": "Hello", "description": "My first tool", "icon": "Sparkles", "entry": "frontend/views/Tool.vue" } ]}Now edit frontend/views/Tool.vue — done. Navigation, routing, titles, enable/disable toggles, the
settings panel, the error boundary and KeepAlive all work automatically, with no manual registration.
The scaffolder generates a skeleton following the plugin directory conventions
(including views/, settings/, components/, composables/, lib/ and shared.ts) that runs
immediately. Then:
- edit
plugin.json(id, display name, icon,tools[].entry) — the single source of truth; - implement
frontend/views/*.vue(UI spec in the design docs); - for backend work add a
#[tauri::command]inbackend/mod.rs; - to persist data append a migration in
backend/migrations.rsand define tables infrontend/schema.ts; - add
README.md(features) andAGENTS.md(dev conventions).
Reference implementations
Section titled “Reference implementations”The following examples all live in the hello-world plugin — browse them before deleting it:
| Goal | File |
|---|---|
| Call Rust commands, logging pipeline, read/write SQLite | frontend/views/Tool.vue (the Rust integration tour) |
| Table + paging + dialog CRUD + import/export | frontend/views/TableTool.vue |
| Form controls and validation | frontend/views/FormTool.vue |
| HTTP requests, results display and streaming download | frontend/views/HttpTool.vue |
| Background task progress / cancel, notifications, event bus | frontend/views/TaskTool.vue |
| Multi-window, open dispatch, shortcuts, platform detection | frontend/views/SystemTool.vue |
| Generic CRUD, transaction atomicity, binary file IO | frontend/views/DataTool.vue |
| Module Panel + 12-grid layout and the three-state standard | frontend/views/TemplateTool.vue |
Next: read the plugin.json fields, or go straight to frontend pages.