AI 程式設計教程中文版
官方教程中文版Agent 工作流

Canvas Tool

基於 Cursor 官方 Canvases 文件解釋互動式 artifact、開啟方式、迭代方式和 Skill 打包。

Canvases 讓 Cursor 在 chat 旁邊生成可互動 artifact(產物,可獨立開啟 / 編輯 / 重新執行的輸出物件)。官方文件給出的定位是:當結果不適合塞進一長段 Markdown table 或 code block 時,Cursor 可以把 dashboard、analysis、audit、report 這類結果放進獨立檢視裡。

閱讀目標:讀完本章,你應該能判斷什麼時候讓 Cursor 生成 canvas,怎樣審查 canvas 的資料和佈局,以及什麼時候把常用 canvas 流程封裝成 skill。

1. Canvas 適合什麼

Canvas 的核心是“獨立視覺化結果”,不是裝飾。適合這些輸出:

輸出型別為什麼適合 Canvas
Dashboard需要 stats、sections、tables 組合呈現
Analysis需要把結論、依據、明細分層展示
Audit需要風險等級、問題列表、修復狀態
Report需要可重新開啟、編輯、迭代和復跑

如果輸出只是 3 條建議,普通 chat 就夠;如果輸出需要佈局、表格、狀態塊和後續迭代,Canvas 更合適。

2. 官方工作流

官方流程可以拆成四步。

flowchart TD
  Prompt["請求 dashboard / analysis / audit / report"] --> Decide["Cursor 判斷是否更適合 Canvas"]
  Decide --> Build["生成 canvas"]
  Build --> Reference["在 chat 中插入引用卡片"]
  Reference --> Review["使用者開啟、審查、編輯或繼續迭代"]
  Review --> Save["儲存到 workspace canvas list"]
  Save --> Reopen["以後重新開啟或用新資料 rerun"]

每個 canvas 都會進入 workspace 的 canvas list。你不需要每次重新跑同一個報告,可以回到過去的 canvas 繼續看、改或用新資料重新整理。

3. 開啟 Canvas

官方列出三個入口:

入口操作
Cursor responseCursor 建立 canvas 後,response 末尾會出現一張 card,點選開啟
Command Palette在 palette 裡執行 Open Canvas,它位於 View 下
Agents Window在 Agents Window 的 new tab menu 中直接開啟 canvas tab

4. 怎麼迭代

Canvas 的迭代方式和普通文件不一樣。官方建議優先讓 Cursor 修改,而不是手工一點點改。

問題更穩的做法
Layout 不合適直接告訴 Cursor 需要怎樣改 sections、stats、tables
數字看起來過期或不對讓 Cursor rerun 底層 query,或 show its work
需要大改結構Revert 後用更具體 prompt 重新生成
只有很小的視覺或文案調整可以手動編輯 source code
深讀:為什麼大改 Canvas 時不要連續小修

Canvas 是佈局化 artifact。結構錯了時,連續追問“這裡再調一下、那裡再加一列”容易把 source 改得越來越散。

官方也建議:較大的 rework 通常 revert 後重新 prompt 更快。重新 prompt 等於重新定義資料來源、佈局、分割槽和格式規則,比在錯誤結構上補丁更可控。

5. 用 Skill 固化 Canvas

官方文件說明,常見 canvas workflow 可以打包成 Skills,讓 Cursor 每次生成一致的佈局。

一個 canvas skill 通常包含:

組成寫什麼
Trigger description什麼時候觸發,比如 quarterly revenue report、dependency audit
Layout instructions包含哪些 sections、stats、tables
Data sources and queries用 SQL query、API call 或 shell command 取什麼資料
Formatting rules單位、日期範圍、排序規則和欄位格式

一旦 skill 建好,團隊成員用很短的 prompt 就能重新生成相同形狀的 canvas,並用新資料重新整理。

6. 驗收清單

商業專案裡看 canvas,重點不是“看起來像報告”,而是這些點:

  • 資料來源是否明確。
  • 統計口徑是否寫清。
  • 排序、單位、日期範圍是否一致。
  • 能不能重新開啟和 rerun。
  • 大改時是否能 revert 後重建。
  • 結果是否適合沉澱成 skill。
  • 是否避免把敏感資料、金鑰、客戶資訊直接放進可分享 canvas。

本章自檢

完成本章後,用這 3 個問題檢查自己是否真正理解:

  1. 什麼輸出適合 Canvas,什麼輸出只需要普通 chat?
  2. Canvas 數字看起來不對時,應該讓 Cursor 做什麼?
  3. 為什麼常見 Canvas workflow 適合打包成 Skill?

透過標準:你能為一個真實審計或報告任務寫出 canvas prompt,並能說明資料來源、佈局、重新整理和驗收方式。

官方來源

  • Cursor Canvases —— 官方說明 Canvas 定位、開啟方式、迭代方式和 Skill 打包。
  • Cursor Agents Window —— 官方說明可以從 Agents Window new tab menu 開啟 canvas tab。
  • Cursor Skills —— 官方說明把可複用工作流封裝為 skills。

接下來去哪

本頁目錄