@surprisal/pi-hyperchart
为Hyperchart工作流提供Pi扩展和React检查器
安装使用
复制下面这段提示词发给你的 AI（Claude / Cursor / TRAE / Codex / WorkBuddy 等），它会自动帮你完成安装：
帮我安装这个 AI Skill：@surprisal/pi-hyperchart。 它的用途是：为Hyperchart工作流提供Pi扩展和React检查器 完整的 Skill 内容见：https://321skill.com/skills/surprisal-pi-hyperchart/raw/index.md 请读取该页面内容，如果是 SKILL.md 格式直接安装，如果是 README 提炼核心 prompt 后安装。
提示词包含完整的 Skill 内容链接，AI 读取后即可完成安装。你也可以 查看完整内容 确认无误。
使用示例
“帮我检查一下这个Hyperchart工作流中‘数据过滤’节点的输出数据是否正确。” 它会引导你使用该Skill的检查器，定位到特定节点，并展示其实时处理后的数据快照，帮助你快速定位数据转换问题。或者，当你对工作流连接逻辑感到困惑时，可以让AI协助解释检查器中展示的节点依赖关系图。
介绍
该Skill是一个专为Hyperchart工作流设计的开发工具，旨在解决开发者在构建和调试复杂数据可视化流程时面临的挑战。它通过提供Pi扩展和React检查器，让开发者能够更直观地理解和操作工作流中的各个节点与数据流。
使用方式上，开发者可以将其作为npm包安装到项目中，然后在开发环境中启用。它通常以浏览器扩展或集成开发环境插件的形式出现，允许开发者在运行时检查Hyperchart组件的状态、属性和数据传递，从而进行实时调试和优化。
这个Skill非常适合正在使用或计划使用Hyperchart框架进行数据可视化应用开发的前端工程师和全栈开发者。特别是那些需要处理动态、交互式图表，且对工作流逻辑的清晰度和可调试性有较高要求的团队。
在使用时，建议结合Hyperchart的官方文档进行配置，并确保开发环境兼容。由于它主要服务于开发阶段，不建议在生产环境中部署其调试功能。初次使用者可能需要一些时间来熟悉检查器的界面和功能布局。
核心特点
这是专为Hyperchart框架深度定制的检查和调试工具，而非通用的React开发工具，能精准映射Hyperchart特有的工作流节点和数据模型。它提供了对Hyperchart可视化流程的原生支持，这是其他通用React检查器所不具备的。
注意事项
仅适用于基于Hyperchart框架的项目，对于使用其他图表库或自定义可视化方案的项目没有帮助。
常见问题
这个工具和React Developer Tools有什么区别？
它是专为Hyperchart工作流定制的，能解析和展示Hyperchart特有的节点与数据流，而React DevTools是通用的组件树查看器。
需要额外配置才能使用吗？
安装后，通常需要在开发环境中启用对应的浏览器扩展或IDE插件，并确保项目使用的是兼容版本的Hyperchart。
给 AI 助手的安装指引
如果你的 AI 编程助手（Claude Code、Cursor、TRAE 等）能看到这个页面，把下面这段发给它即可自动完成安装：
请访问 https://321skill.com/skills/surprisal-pi-hyperchart/raw/index.md 读取 @surprisal/pi-hyperchart 的原始 Skill 定义（Markdown 格式），按其中说明在我的环境里完成安装和配置。
AI 可直接读取的原始 Markdown 地址：/skills/surprisal-pi-hyperchart/raw/index.md（查看排版版本）