简介

Flamo 将设计结构、交互脚本与运行时连接起来。你可以从 Figma 设计或代码开始，在 Studio 中开发和预览，再将界面以 Web Component 接入产品。

三个核心对象贯穿这一过程：Artifact 保存设计与行为，Runtime 负责执行，Instance 是挂载后可以操作的界面实例。

Artifact 开发入口

从 Figma 设计或 Flamo Design 创建 Artifact，保留布局、变量和组件结构。

TS/JS 开发入口

使用公开 API 编写交互、更新属性、组合已有组件。

统一 Runtime

用同一个 Runtime 挂载界面、管理实例和释放资源。

W3C 宿主边界

使用标准 Web Component、属性、事件和插槽接入宿主应用。

两种入口，一个结果

Figma / Codex / typed authoring ─┐
                                ├─> canonical Artifact ─> Runtime ─> FlamoInstance
TS / JS component authoring ────┘                         └─> Web Component

两种入口可以组合使用：设计工具负责视觉结构，脚本负责交互行为，最终都交给 Runtime 运行。浏览器执行 JavaScript，TypeScript 在开发或发布阶段编译。

推荐学习路径

1. 在Artifact 开发入口和 TS/JS 开发入口中选择起点。
2. 依次理解 Runtime、Artifact、组件与实例。
3. 需要设计协作时进入“结合 Figma 使用”或“结合 Codex 使用”。
4. 需要独立浏览器交付时阅读导出 web-component。

查找接口与交付方式

编写脚本时查阅 API Reference，处理设计数据时使用 Artifact 字段手册。这两份参考随 Runtime 的公开类型更新。发布只承诺 browser-esm 与 thin-single-js，不提供把 Runtime、Artifact、脚本和全部资源内联到一个文件的 standalone-single-js。