创建插件
推荐用脚手架交互生成(自动填好 id / 名称 / 图标,以及可选的后端、设置、数据库、生命周期钩子等):
pnpm create-plugin或手动复制模板:
cp -r plugins/_template plugins/my-tools然后编辑 plugins/my-tools/plugin.json:
{ "id": "my-tools", "name": "我的工具", "tools": [ { "id": "my-tools-hello", "name": "你好", "description": "我的第一个工具", "icon": "Sparkles", "entry": "frontend/views/Tool.vue" } ]}再改写 frontend/views/Tool.vue——完成。侧栏导航、路由、标题、启停开关、设置面板、
错误边界、KeepAlive 全部自动生效,无需任何手动注册。
脚手架按插件目录规范生成骨架(含 views/、settings/、components/、
composables/、lib/、shared.ts),生成后即可运行。随后:
- 改
plugin.json(id、显示名、图标、tools[].entry)——唯一事实源; - 实现
frontend/views/*.vue(UI 规范见设计规范); - 需要后端时在
backend/mod.rs加#[tauri::command]; - 需要落库时在
backend/migrations.rs追加迁移,并在frontend/schema.ts定义表; - 补
README.md(功能)与AGENTS.md(开发约定)。
以下示例都在 hello-world 插件里,删除前可对照:
| 想做什么 | 看哪个文件 |
|---|---|
| 调用 Rust 命令、日志管道、读写 SQLite | frontend/views/Tool.vue(Rust 集成大全) |
| 表格 + 分页 + 弹窗增删改 + 导入导出 | frontend/views/TableTool.vue |
| 各种表单控件与校验 | frontend/views/FormTool.vue |
| 发 HTTP 请求展示结果、流式下载 | frontend/views/HttpTool.vue |
| 后台任务进度 / 取消、通知、事件总线 | frontend/views/TaskTool.vue |
| 多窗口、打开内容分发、快捷键、平台探测 | frontend/views/SystemTool.vue |
| 通用 CRUD、事务原子性、二进制文件读写 | frontend/views/DataTool.vue |
| 模块 Panel + 12 栅格布局与三态标准写法 | frontend/views/TemplateTool.vue |
下一步:了解 plugin.json 字段,或直接写 前端页面。