w

Cursor Canvas 工具

粘贴 Cursor 生成的 .canvas.tsx,在浏览器里预览,并生成可分享短链。

常见问题

为什么看起来和 Cursor 不一样? 本预览用 React 重做了公开的 cursor/canvas API,不是 Cursor IDE 运行时。间距、图表和控件会接近,但不是像素级一致。

Agent 按钮能用吗? 部分可以。useCanvasAction 会通过 deeplink(cursor://)唤起 Cursor。聊天提示和绝对文件路径可用;相对路径和 Agent 会话 id 无法对准本地工作区,因此会改成预填提示。

短链会过期吗? 会一直保留,直到所有者在 已发布短链 里删除。不是阅后即焚。

为什么发布失败? 后端必须在运行,源码必须从 cursor/canvas 导入。空文件、超过 20 万字符的文件,以及不允许的 import 都会被拒绝。

为什么预览是空白的? 文件需要有返回 canvas 组件的 default export。可到 示例 页展开已知可用的结构。

能导入 lucide-react 或本地文件吗? 不能。只允许 cursor/canvas 和 React。需要图标时,把小 SVG 内联进 IconButton

源码是私密的吗? 只有在生成短链之前。之后任何拿到 URL 的人都能加载源码。

「加载示例」和这些文档一样吗? 不一样。工具里的 加载示例 会注入完整 SDK 目录。文档用更小的 preview,方便一次复制一个想法。

这个页面对您有帮助吗?