)
从零构建你的第一个终端扩展Muxy扩展开发教程含Vite脚手架与window.muxy桥【免费下载链接】muxyLightweight and Memory efficient terminal for Mac built with SwiftUI and libghostty项目地址: https://gitcode.com/gh_mirrors/muxy1/muxyMuxy 是一款用 SwiftUI 与 libghostty 构建的轻量、省内存的 Mac 终端而 Muxy 终端扩展机制让你用熟悉的 Web 技术HTML JavaScript就能给终端添加面板、命令与自动化能力。本 Muxy 扩展开发教程带你从零走完全流程用官方 Vite 脚手架一键生成项目、读懂构建产物、通过window.muxy桥与终端工作区对话约 10 分钟即可跑通你的第一个扩展。为什么 Muxy 扩展是「Web 项目」很多新手会惊讶终端扩展竟然是个 npm 工程这正是 Muxy 的设计取舍——扩展就是一个npm Vite 项目执行npm run build后产出dist/目录Muxy 加载的就是这个构建产物而不是你的源码扩展的页面面板、标签页等以 WKWebView 内嵌渲染页面里自动注入window.muxy桥对象扩展借此读写工作区可选声明一个background.js后台脚本Muxy 会在独立的 MuxyExtensionHost 宿主进程 中运行它崩溃也不会拖垮主程序。 这意味着你无需学 Swift 就能给 Muxy「装插件」——会写前端就能开发 Muxy 扩展。认识 Muxy轻量终端 可扩展架构Muxy 的核心卖点是轻与省内存同时保留高度可定制性。它的扩展能力一览如下能力说明对应 Manifest 字段停靠/悬浮面板在侧边或底部嵌入你自己的 Web 界面panels命令面板命令注册可搜索的快捷命令含快捷键commands顶栏/状态栏图标在标题栏或底部状态栏放入口图标topbarItems/statusBarItems事件订阅监听面板创建、标签聚焦等工作区事件events外部集成受权限约束时执行 shell 命令、HTTP 请求、Git 操作permissions安全模型方面Muxy 采用「最小权限」设计每个会改变状态的调用都必须在 Manifest 里声明对应permissions订阅事件也只能订阅已声明的白名单执行代码类操作还会弹出运行时确认。详情见 docs/extensions/permissions.md 与 docs/extensions/overview.md。2 分钟从 0 到 1用 Vite 脚手架创建第一个 Muxy 扩展Muxy 自带一套名为 vanilla 的起步模板原生 JS Tailwind CSS Vite内置一个「Hello 面板」示例是理解整套机制的最佳入口。第 1 步Extensions 面板一键脚手架在 Muxy 中打开Extensions弹窗点击Create选择存放文件夹命名为my-extensionMuxy 会自动复制 vanilla 脚手架并作为开发扩展加载界面上带DEV徽标。第 2 步最快构建方法——安装依赖并产出 distcd my-extension npm install npm run build构建完成后你会得到 Muxy 真正读取的dist/目录。模板的build脚本是vite build node scripts/copy-manifest.mjs——第二步会把package.json拷进dist/因为发布的扩展只包含 distManifest 必须在里面原理见 scripts/copy-manifest.mjs。第 3 步Reload 重载并验证效果回到 Muxy 的 Extensions 弹窗点击Reload然后按⌘⇧H或点击标题栏的星光图标——Hello 面板开合切换说明你的扩展已经运行起来了 ✅读懂脚手架vanilla 模板结构拆解对着这份清单看模板文件扩展开发的脉络就清晰了文件作用package.jsonManifest 所在处顶层name/versionmuxy声明块vite.config.js构建配置Tailwind 插件、别名、输出到dist/scripts/copy-manifest.mjs构建后把package.json拷入dist/src/panel/app.jsHello 面板 UI演示window.muxy事件订阅panel/index.html面板入口页被 Manifest 的entry引用window.muxy 桥速查扩展如何调用终端能力window.muxy是 Muxy 注入到每个扩展页面里的桥对象是扩展与终端对话的唯一通道。常用命名空间命名空间能力muxy.tabs/muxy.panes操作标签页、终端窗格muxy.projects/muxy.worktrees读取项目与 worktree 状态muxy.files/muxy.git文件与 Git 信息muxy.events订阅工作区事件与自己的命令事件muxy.exec受权限二次确认约束的 shell 执行muxy.http网络请求muxy.toast/muxy.notifications轻提示与系统通知muxy.dialog/muxy.modal对话框与模态窗muxy.panels/muxy.topbar/muxy.statusbar控制界面元素starter 模板里就有一行典型的桥用法见 app.jsmuxy.events.subscribe(command.refresh-hello, () this.bump());面板头部按钮触发的command.refresh-hello命令会转成事件推送到页面计数器随之 1——这就是「命令 → 事件 → UI 更新」的最小闭环完整事件列表见 docs/extensions/events.md。Manifest 配置指南package.json 中的 muxy 字段Manifest 就是 package.json 里的muxy对象vite 模板中它声明了permissions: [panels:write]——申请面板操作权限panels——Hello 面板的入口、位置右侧停靠与头部刷新按钮commands——toggle-hello快捷键 ⌘⇧H与refresh-hello两条命令见 package.jsontopbarItems——标题栏的星光图标。新手最需要注意的两点只申请你真正需要的权限。未声明的调用会被 Muxy 直接拒绝改完 Manifest 或源码后要 Reload。扩展加载后默认处于禁用状态需在 设置 → Extensions 中显式启用。进阶后台脚本 background.js可选大部分扩展不需要后台脚本。只有当你需要常驻事件监听、跨多个 webview 协调、后台轮询时才在 Manifest 中声明muxy.background。此时 Muxy 会在独立宿主进程中运行它console.*输出会进入应用内日志随时可在 Settings → Extensions 查看——架构细节参考 Muxy/Services/Extensions/ExtensionStore.swift。调试与发布小贴士快速迭代npm run dev可启动 Vite 开发服务器但 Muxy 读取的是dist/所以每次改完记得npm run buildReload卸载扩展详情页的Remove from Muxy只从 Muxy 中移除不会删除磁盘上的文件夹发布前检查确认dist/里含package.json所有entry/background路径都相对于dist/解析。想直接浏览实现源码可以克隆仓库git clone https://gitcode.com/gh_mirrors/muxy1/muxy继续深入官方文档导航快速上手docs/extensions/get-started.md架构总览docs/extensions/overview.mdManifest 全字段docs/extensions/manifest.md面板开发docs/extensions/panels.md命令面板docs/extensions/palette-commands.md权限模型docs/extensions/permissions.md到这里你的第一个 Muxy 终端扩展已经能跑了 下一步建议把 Hello 面板换成真实数据比如muxy.git拉取当前分支状态你会立刻体会到window.muxy桥的威力。【免费下载链接】muxyLightweight and Memory efficient terminal for Mac built with SwiftUI and libghostty项目地址: https://gitcode.com/gh_mirrors/muxy1/muxy创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考