Raycast 插件开发

💡 原文中文,约1700字,阅读约需4分钟。
📝

内容提要

Raycast 插件使用 TSX 和 React 开发,界面仅支持官方控件。核心是 Command,分为列表、详情、表单三种主体控件,命令面板通过 Action 执行操作。功能性 API 可与系统交互,Preference 需在 package.json 中声明。发布需 fork 官方仓库并提交 PR,目前仅支持英文插件。

🔎

延伸解读

与 uTools 的架构差异

文章指出 Raycast 插件与 uTools 有较大不同。uTools 中一个插件往往就是一个界面,开发者可自由排布控件完成功能;而 Raycast 不提供自行绘制 UI 的能力,基本 UI 控件只能单独占有一个页面,需通过跳转页面来输出结果。这种限制意味着开发者需要适应以 Command 为中心、页面跳转的交互模式,而非在一个界面内堆叠控件。

命令面板:Raycast 的交互核心

在 Raycast 中,无法自行放置按钮,所有操作统一通过右下角的命令面板执行。命令面板以 ActionPanel 为容器,Action 作为具体功能入口,并可通过 Section 分组。预设 Action 能操作剪切板、打开浏览器、提交表单、开启访达、跳转页面等,也可自行编写函数。主体控件均接受 actions 参数,编写的命令需传入此处才能在当前页面访问。

Preference 的声明与使用

Preference 与 Command 呈并列关系,使用前需在 package.json 中声明。若设定 required=true,则在运行 Command 前,插件会先要求用户完成设定项。这适用于指引用户填写用户名、API、token 等行为。开发者需注意,Preference 的声明是使用该功能的前提,且 required 属性会影响用户首次使用时的流程。

发布流程与英文限制

文章提到,目前插件发布流程仍不甚友好。在插件符合官方要求的基础上,需自行 fork 官方插件仓库,补充代码后提交 PR,经审核方可发布。值得注意的是,截至本文写作,官方仅支持英文插件,无论是插件指令还是操作说明均需为英文,即使插件并不面向英文用户,否则无法通过审核。当然,仅自用而不发布也是完全可行的。

❓

Q&A

Raycast 插件开发使用什么技术栈?

Raycast 插件使用 TSX 和 React 开发,可以借助 Node.js(>=16.10)生态实现功能,但界面绘制仅支持官方 @raycast/api 包提供的控件。

Raycast 插件中的 Command 是什么?

Command 是 Raycast 插件的核心,会直接列举在呼出的面板上,并根据使用习惯排序。Command 之间可以共享和传递数据,但不共享页面。

Raycast 插件支持哪些界面主体控件?

官方提供三种主体控件:列表(List)、详情(Detail)和表单(Form)。列表由输入框、列表项和命令面板组成;详情用于展示文本或 Markdown;表单支持输入框、下拉框、多选、日期选择等交互。

Raycast 插件如何执行操作?

通过命令面板(ActionPanel)执行操作,其中包含具体的 Action。Action 可以操作剪切板、打开浏览器、提交表单、开启访达、跳转页面等,也可以自行编写函数。在主体控件中需传入 actions 参数才能在当前页面访问这些命令。

Raycast 插件的 Preference 功能如何使用?

Preference 与 Command 并列,需要在 package.json 中声明。如果设置为 required=true,则在运行 Command 前会要求用户完成设定,适用于引导用户填写用户名、API、token 等。

如何发布 Raycast 插件?

发布流程需要 fork 官方插件仓库,补充插件代码后提交 PR,经过审核方可发布。目前官方仅支持英文插件,插件指令和操作说明均需为英文,否则无法通过审核。

🏷️

标签

➡️

继续阅读