vuepont/ai-elements-vue

解決的問題

建構 AI 界面需要專門的 UI 模式——例如推理顯示、工具執行核准和來源引用——這些在標準 UI 庫中並不存在。AI Elements Vue 提供一組預先建構、可自訂的元件，專為這些 AI 驅動的互動設計，大幅減少建構複雜 AI 聊天與工作流程介面所需的工作量。

如何運作

它作為一個 CLI 工具運作，與 shadcn-vue 整合。當你執行 CLI 時，它會取得元件註冊表，並將請求的元件直接安裝到專案的 components 目錄中。此方法讓元件成為你程式碼庫的一部分，確保你對其樣式與邏輯擁有完全控制權。它需要一個已安裝 Tailwind CSS 和 AI SDK 的 Vue.js 或 Nuxt.js 專案。

適用對象

使用 Vue.js 或 Nuxt.js 建構 AI 應用的開發者，希望實現專業級 AI UI 模式（如「氣氛編碼」成果物或思考鏈顯示）而無需從零開始建構。

主要特色

• AI 專用元件：包含用於思考鏈推理、模型選擇器、提示輸入和工具使用可視化的專用元素。
• 工作流程可視化：提供一組基於畫布的元件（節點、邊與控制項），用於建構 AI 工作流程圖。
• 氣氛編碼支援：包含用於顯示成果物與嵌入網頁預覽的元件。
• CLI 驅動安裝：透過 npx 輕鬆整合，可選擇新增整個套件或個別元件。