ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

10 分钟上手 WaveTerm 插件开发:把常用工具钉进终端侧栏

10 分钟上手 WaveTerm 插件开发:把常用工具钉进终端侧栏 10 分钟上手 WaveTerm 插件开发把常用工具钉进终端侧栏【免费下载链接】wavetermAn open-source, AI-integrated, cross-platform terminal for seamless workflows项目地址: https://gitcode.com/GitHub_Trending/wa/waveterm想把 CPU 曲线钉在终端侧边、让 fish shell 一键打开WaveTerm 插件开发里这类需求往往只要几行配置。本文先说清它能做什么再帮你选路、落地第一个插件。能力全景能做什么这一节回答插件能做哪些形态。WaveTerm 的插件叫 Widget分配置型和代码型两条路线插件类型典型用途实现成本CLI 型term cmd一键跑固定命令网速测试、TUI 工具十来行 JSONShell 型term shell专属 fish / pwsh 会话十来行 JSONWeb 型web网页直接内嵌成标签页两三行 JSON系统监控型sysinfoCPU/内存曲线、自定义时间窗两三行 JSON代码型Tsunami交互面板、实时图表、自定义 UI一个 Go 工程构建后复用AI 集成叠加任意型加一行cmd:jwt: true即可被 WaveAI 访问1 行配置选路配置型还是代码型这一节帮你二选一。标准就一条能用开一个窗口跑 X描述的功能选配置型需要按钮交互、数据每秒更新、自定义图表才上代码型。配置型零代码、改完即用适合第一次动手代码型要 Go 环境但上限高得多。第一个插件只改几行配置这一节让你 5 分钟拿到第一个 Widget。打开WAVETERM_HOME/config/widgets.json在最外层对象里加入下面这段{ fish : { icon: fish, color: #4abc39, label: fish, blockdef: { meta: { view: term, controller: shell, term:localshellpath: /usr/local/bin/fish } } } }改哪里、看到什么fish顶层键Widget 的唯一名字只影响这份 Widget 配置的索引。iconFont Awesome 图标名换成circle-3、gauge-high都行。label和colorwidget bar 里显示的文本与颜色是用户第一眼看到的东西。view: term声明终端类型改成web变网页块sysinfo变系统曲线。controllershell是持久会话改成cmd并加cmd字段就变成一次性的命令行。term:localshellpathshell 可执行文件必须写绝对路径。预期效果保存后重启 WaveTermwidget bar 出现绿色小鱼图标点击直接开出运行 fish 的新终端。代码型插件的三个关键动作这一节以官方 cpuchart 为例讲清 Tsunami 插件里真正起作用的三处代码。声明元数据AppMeta里写插件标题与简介实时数据放进DataAtom它是响应式变量值一变界面自动刷新。定时采集在 App 组件里用app.UseTicker(time.Second, ...)注册每秒回调采一次 CPU 占用写进原子块关闭时计时器自动清理不用手动管理。渲染界面组件返回一棵vdom.H树描述界面样式类直接用 Tailwind也能混入 recharts 这类现成图表组件。三个动作合起来的骨架完整版见 tsunami/demo/cpuchart/app.govar AppMeta app.AppMeta{Title: CPU Usage Monitor} var App app.DefineComponent(App, func(_ struct{}) any { app.UseTicker(time.Second, func() { cpuDataAtom.SetFn(func(d []CPUDataPoint) []CPUDataPoint { return append(d, generateCPUDataPoint()) }) }, []any{}) return vdom.H(div, map[string]any{className: min-h-screen p-6}) })第一行是元数据回调体是采集点返回的 vdom 树就是界面。打包、安装与验证 这一节回答写完之后怎么跑起来。WaveTerm 插件打包安装对配置型没有额外步骤——widgets.json 本身就是安装位置。代码型用 Go 构建cd tsunami/demo/cpuchart # 换成你的插件目录 go build -o cpuchart . ./cpuchart改哪里把第一行换成你自己的插件目录-o后的名字决定二进制名。预期效果构建无报错、产出二进制运行后打开独立窗口CPU 曲线每秒跳动。验证成功的判断标准配置型重启后 widget bar 出现新图标点击能打开对应块——跑着 fish 的终端、指定网页或系统曲线三者居其一即可。代码型go build通过、二进制可运行、界面持续刷新。想把代码型插件挂成终端块在 widgets.json 加一条 term cmd 条目命令填插件路径并设cmd:jwt: true给它注入鉴权 token。避坑清单这一节汇总五个最常见的翻车点均按现象 → 原因 → 处理改完 widgets.json 后 widget bar 没变化→ 应用仍在读旧配置或 JSON 语法非法导致整份文件被丢弃 → 先校验 JSON 语法再完全退出并重启 WaveTerm 验证。shell 型插件打开的还是默认 shell→ 目标 shell 不在系统 PATH相对路径无效 → 把term:localshellpath换成绝对路径如/usr/local/bin/fish。代码型插件以 widget 打开时报错或空白→ 运行环境缺 JWT 鉴权 token → 在该条目的 meta 里加cmd:jwt: true。sysinfo 曲线始终是 CPU→sysinfo:type区分大小写且只认CPU、Mem、CPU Mem、All CPU四个值 → 原样复制别自创写法。图标不显示→ 图标名不在 Font Awesome 库中 → 换成有效名称品牌图标要加brands前缀。延伸入口这一节是继续深入的地图。docs/docs/customwidgets.mdx自定义 Widget 官方文档含全部键值表与 Font Awesome 图标写法。tsunami/demo/官方示例插件目录含 cpuchart、pomodoro 等完整 Go 工程。tsunami/app/Tsunami 框架 API组件、原子与 hooks 的定义。BUILD.mdWaveTerm 本体的编译构建指南。从几行 Widget 配置起步你的终端很快就长出自己的形状。【免费下载链接】wavetermAn open-source, AI-integrated, cross-platform terminal for seamless workflows项目地址: https://gitcode.com/GitHub_Trending/wa/waveterm创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表