TinyEngine 2.8 正式上线：AI 能力就位、Docker 一键起飞！

前言

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.jsexport 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 进行修复 。每一步前行都值得铭记，感谢有您陪伴我们一起迭代成长，同时也欢迎大家加入社区讨论，参与社区共建！

关于 OpenTiny

欢迎加入 OpenTiny 开源社区。添加微信小助手：opentiny-official 一起参与交流前端技术～

OpenTiny 官网：https://opentiny.design

OpenTiny 代码仓库：https://github.com/opentiny

TinyVue 源码：https://github.com/opentiny/tiny-vue

TinyEngine 源码： https://github.com/opentiny/tiny-engine

欢迎进入代码仓库 Star🌟TinyEngine、TinyVue、TinyNG、TinyCLI、TinyEditor~如果你也想要共建，可以进入代码仓库，找到 good first issue 标签，一起参与开源贡献~