TinyEngine 2.8 正式上線：AI能力就位、Docker部署更高效！ Detail - 敏捷開發 huaweiyun Blog

本文分享自華為雲社區《TinyEngine 2.8 正式上線：AI能力就位、Docker部署更高效！》，作者：OpenTiny。

前言

TinyEngine低代碼引擎使開發者能夠定製低代碼平台。它是低代碼平台的底座，提供可視化搭建頁面等基礎能力，既可以通過線上搭配組合，也可以通過cli創建個人工程進行二次開發，實時定製出自己的低代碼平台。適用於多場景的低代碼平台開發，如：資源編排、服務端渲染、模型驅動、移動端、大屏端、頁面編排等。

近期，我們正式推出TinyEngine v2.8 版本，希望能夠給大家帶來更好的使用體驗，能夠深度定製化的同時可以更簡潔便利地配置。

源碼：https://github.com/opentiny/tiny-engine（歡迎 Star ⭐）
官網：https://opentiny.design/tiny-engine#/home

這次版本特性開發和問題修復已經有更多的開發者朋友參與進來，我們在此誠摯感謝 @timtiam @0x7A7A6572 @QxQstar @LLDLLY 積極參加 TinyEngine 的開源共建，同時也邀請大家一起加入開源社區的建設，讓 TinyEngine 成長的更加優秀和茁壯。

v2.8.0 變更特性概覽

【增強】【AI 新特性】更新 robot 插件 UI 並新增 MCP 工具。
【增強】【區塊管理】添加區塊雙向綁定屬性選擇功能到事件表單。
【增強】【物料】支持在物料列表中隱藏內置物料。
【增強】【狀態管理】應用狀態僅允許 JSON 對象。
【其他】升級 vue-repl、同步頁面狀態和全局狀態的保存行為。
【其他】支持前後端Docker部署。
【其他】文檔更新、功能細節優化與bug修復、mockserver 支持自定義數據庫路徑等等與一系列 bug 修復。

TinyEngine v2.8.0 新特性解讀

1. 【AI 新特性：更新 robot 插件 UI 並新增 MCP 工具（體驗版本）。

在TinyEngine v2.8+版本中，我們對AI插件進行了一系列新能力的升級：

使用 TinyRobot組件（OpenTiny體系面向AI場景的全新組件/產品）更新了AI插件UI，UI煥然一新。
集成OpenTiny Next SDK 支持了 MCP（Model Context Protocol）工具引擎，讓AI能夠直接調用平台插件功能，實現"對話即操作"的智能開發體驗！
添加了MCP MetaService，將部分平台插件的關鍵能力封裝成了可供AI通過MCP協議調用的工具，並支持添加拓展更多的工具。

1）AI插件新特性

核心能力：

AI可通過MCP協議直接操作平台能力（創建詞條/創建頁面/修改屬性等）
支持可視化管理MCP工具

使用步驟：

設置模型接口：

支持通過AI插件的customCompatibleAIModels選項自定義添加OpenAI兼容格式大模型（使用MCP功能需要使用支持tools的大模型），建議使用DeepSeek R1/V3、Qwen3、Gemini等對工具支持良好的模型，優先使用滿血模型、推理類型模型效果更好。

// registry.js
[META_APP.Robot]: {
  options: {
    customCompatibleAIModels: [
      { label: 'SiliconFlow：DeepSeek-V3', value: 'deepseek-ai/DeepSeek-V3', manufacturer: 'siliconflow' },
      { label: 'Qwen：qwen-max', value: 'qwen-max', manufacturer: 'qwen' },
    ]
  }
},

可以配置本地的MCP工具使用的AI模型接口Proxy, 以百鍊為例：

// vite.config.js
const originProxyConfig = baseConfig.server.proxy
baseConfig.server.proxy = {
  '/app-center/api/chat/completions': {
    target: 'https://dashscope.aliyuncs.com',
    changeOrigin: true,
    rewrite: path => path.replace('/app-center/api/', '/compatible-mode/v1/'),
  },
  ...originProxyConfig,
}

配置模型：

首次使用或切換AI模型時，需要進行配置：

1）點擊右上角設置按鈕
2）選擇合適的AI模型
3）輸入對應的API Token
開始對話：輸入問題開始對話吧

場景示例：

智能頁面生成：“創建一個登錄頁，包含賬號密碼輸入和提交按鈕”
批量屬性修改：“把所有輸入框邊框改為紅色”

2）MCP MetaService

MCP MetaService 是註冊管理MCP相關能力的核心元服務。目前支持 MCP 工具的自動收集、增刪改查、調用工具等等能力。

獲取 mcpClient：

const client = getMetaApi(META\_SERVICE.McpService)?.getMcpClient()

工具管理相關 api 示例：(ai 對話框已經集成了，這裏僅列出簡單的調用示例)

const client = getMetaApi(META\_SERVICE.McpService)?.getMcpClient()

// 列出工具
client.listTools()

// 調用工具
client.callTool({ name: toolId, arguments: args })

// 禁用或者啓用某個工具
client.upateTool(toolId, { enabled: true/false })

插件註冊MCP工具：

MCP MetaService 已經具備了從註冊表中收集 mcp 相關工具的能力，我們僅需在插件的註冊表上聲明相關的 mcp 工具，就可以集成到 AI對話框中等待大模型在合適的場景調用。

註冊示例

a. 聲明工具：

// 聲明工具：

const addI18n = {
  name: 'add\_i18n',
  description:
    'Add a new i18n entry to the current TinyEngine low-code application. Use this when you need to add new internationalization translations to your application.',
  // 入參聲明
  inputSchema: inputSchema.shape,
  // 出參聲明
  outputSchema: outputSchema.shape, // 使用 Zod 版本的統一輸出結構
  annotations: {
    title: 'Add I18n Entry',
    readOnlyHint: false,
    destructiveHint: false,
    idempotentHint: true,
    openWorldHint: false
  },
  callback: async (args: z.infer\<typeof inputSchema>) => {
    // ... 調用相關方法實現 i18n 詞條的添加
  }
}

b. 在插件註冊表中聲明：

import { addI18n, delI18n, updateI18n, getI18n } from './tools'

export const TranslateService = {
  id: 'engine.service.translate',
  // .... 其他註冊表聲明項
  mcp: {
    // 工具聲明
    tools: \[addI18n, delI18n, updateI18n, getI18n]
  }
}

2. 【區塊管理】添加區塊雙向綁定屬性選擇功能到事件表單。

v2.8 版本中，由外部開發者 @0x7A7A6572 在區塊管理-事件設置事件名的輸入框中，添加了快捷綁定 onUpdate 事件（雙向綁定屬性使用）的按鈕，提升用户的體驗。

關聯PR：https://github.com/opentiny/tiny-engine/pull/1453

3. 【物料】支持在物料列表中隱藏內置物料。

在 V2.8 版本中。（實際上 v2.7.2 也已經支持了）。我們增加了隱藏內置物料的能力。方便二開用户根據自身的垂直業務場景決定是否在物料面板中展示內置組件。

配置項名稱： hiddenBuiltinMaterials

配置示例：

// registry.js
export default {
  \[META\_APP.Materials]: {
    options: {
      hiddenBuiltinMaterials: \[
        'Box', // 盒子容器（普通div 容器）
        'CanvasRowColContainer', // 行列容器
        'CanvasFlexBox', // 彈性容器
        'CanvasSection', // 全寬居中容器
        'Text', // 文本
        'Icon', // 圖標
        'Img', // 圖片
        'Slot', // 插槽（區塊插槽需要）
        'RouterView', // 路由視圖（子頁面需要，不建議隱藏）
        'RouterLink', // 路由鏈接
        'Navigation', // 導航條
        'NavigationV', // 縱向導航條
        'Collection' // 數據源容器（數據源功能依賴，不建議隱藏）
      ]
    }
  }
}

使用場景：

隱藏不常用的內置組件，簡化物料面板
根據項目需求定製顯示的組件列表

關聯PR：https://github.com/opentiny/tiny-engine/pull/1537

4. 【狀態管理】應用狀態僅允許 JSON 對象。

在 v2.7 版本以前，我們的應用狀態提示 state 的初始狀態可以是字符串、數字、布爾值、對象、數組等等值，但是實際上，由於全局狀態的底層實現是 pinia，初始化的狀態只能是 object。
這樣可能會在提示上存在誤導，導致用户使用錯誤。

錯誤使用示例：

在 v2.8 版本，我們修改為只允許使用 json 對象，避免錯誤使用：

關聯PR: https://github.com/opentiny/tiny-engine/pull/1443

5. 升級 vue-repl、同步頁面狀態和全局狀態的保存行為。

1) vue-repl 升級

v2.8 版本中，我們將頁面預覽的底層依賴 vue-repl 從 v2.9 升級到了 v4.6.1。vue-repl v4.6.1 支持 jsx 的編譯，無需額外使用 @vue/babel-plugin-jsx 進行手動轉換。

關聯PR：https://github.com/opentiny/tiny-engine/pull/1459

2) 同步頁面狀態和全局狀態的保存行為

v2.8 版本中，我們將頁面狀態和全局狀態的保存行為一致化。

原來的頁面狀態點擊保存的行為	原來應用狀態點擊保存的行為	統一後的點擊保存行為
關閉狀態管理插件	關閉編輯面板	關閉編輯面板。（狀態管理插件不關閉，停留在列表）
提示保存成功	\	提示保存成功

6. 支持前後端Docker部署正式發佈

告別複雜的環境配置！在最新版本中，TinyEngine現已支持全棧Docker-Compose部署，前端+Java後端5分鐘即可完成服務器部署，享受容器化帶來的高效與穩定！

核心價值：

開箱即用的全棧方案：預置Nginx反向代理配置，自動構建Node+Java容器化環境
極簡操作流程：只需幾行命令完成前後端的部署上線

操作步驟：

1）環境準備：安裝docker與docker compose，使用git clone命令拉取 tiny-engine前端代碼、後端代碼
2）修改配置：修改nginx.conf中的ip/域名
3）一鍵啓動/停止：

  # 啓動服務
    cd tiny-engine-backend-java && docker-compose up -d
    # 停止服務
    docker-compose stop
    # 查看日誌
    docker-compose logs -f

如此即已完成服務部署上線，現在就來體驗三分鐘完成全棧部署的高效工作流吧！

7. 功能細節優化&bug修復

mockserver 支持自定義數據庫路徑 @hexqi #1501
修復選中框佔滿畫布時，選中的工具欄位置被遮擋的 bug。@chilingling #1581
禁止選中工具欄雙擊選中，避免意外整個畫布被選中的 bug @chilingling #1569
TinyGrid 物料增加版本配置。@LLDLLY #1568
修復頁面預覽祖先頁面頂層為文件夾的時候頁面顯示不正確的 bug @chilingling #1567
README 文檔更正。@QxQstar #1532

以上是此次更新問題修復的主要內容,如需瞭解更多可以查看：v2.8.0 所有 changelog

結語

TinyEngine 2.8 版本更新不僅有全新的AI插件與 MCP 工具嚐鮮、區塊雙向綁定體驗增強、vue-repl 升級，還支持隱藏內置物料、對頂層文件夾預覽等等 bug 進行修復。每一步前行都值得銘記，感謝有您陪伴我們一起迭代成長，同時也歡迎大家加入社區討論，參與社區共建！

點擊關注，第一時間瞭解華為雲新鮮技術~

huaweiyun Blog

@huaweiyun

Tags

前端 (1157)

angular (73)

雲計算 (56)

敏捷開發 (15)

AI綜合 (12)

Stories

TinyEngine 2.8 正式上線：AI能力就位、Docker部署更高效！ - Stories Detail

前言