TinyEngine2.9 版本发布：更智能，更灵活，更开放！

前言

TinyEngine 是一款面向未来的低代码引擎底座，致力于为开发者提供高度可定制的技术基础设施——不仅支持可视化页面搭建等核心能力，更可通过 CLI 工程化方式实现深度二次开发，帮助团队快速构建专属的低代码平台。

无论是资源编排、服务端渲染、模型驱动应用，还是移动端、大屏端、复杂页面编排场景，TinyEngine 都能灵活适配，成为你构建低代码体系的坚实基石。

最近我们正式发布 TinyEngine v2.9 版本，带来多项功能升级与体验优化，在增强平台智能化能力的同时，进一步降低配置复杂度，让“定制化”变得更简单、更高效。

• 开源地址：https://github.com/opentiny/tiny-engine（欢迎 Star ⭐）

• 官方网站：https://opentiny.design/tiny-engine#/home
  

本次版本迭代中，我们欣喜地看到越来越多开发者加入开源共建行列。特别感谢@fayching @LLDLLY 等社区伙伴积极参与功能贡献与问题反馈。正是这些点滴汇聚的力量，推动着 TinyEngine 不断前行。我们也诚挚邀请更多热爱技术、追求创新的朋友加入社区，一起打造更强大、更开放的低代码生态。

v2.9.0 变更特性概览

• 【增强】全新版本 AI 助手，智能搭建能力升级

• 【新特性】添加资源管理插件和资源选择配置器

• 【增强】预览插件支持应用预览

• 【增强】Tailwindcss 支持

• 【增强】支持静态数据源

• 【增强】组件物料更新

• 【增强】MCP 工具更新

• 【其他】功能细节优化与 bug 修复。

TinyEngine v2.9.0 新特性解读

1. 【增强】全新版本 AI 助手，智能搭建能力升级（体验版本）

在 TinyEngine v2.9 版本中，我们对 AI 搭建页面能力进行全新升级，下面是主要功能的介绍与快速上手：

1）全新 Agent 模式

新增的 Agent 模式支持自然语言或图片生成页面，借助 AI 大模型强大的能力，让您告别繁琐的手动拖拽，让 AI 辅助开发更加智能、强大。

• 全新 Agent 智能搭建模式，自然语言描述需求，由 AI 直接返回页面 Schema

• 画布采用流式渲染，能够实时看到页面生成效果

• 生成页面后支持继续对话二次修改，使用增量返回修改速度更快

• 支持上传设计图或手绘草图，AI 识别并还原为可编辑的页面（需要先选择视觉模型）

• 

2）基础能力升级

• 现代化界面：全新的聊天界面，支持 Markdown 渲染、代码高亮

• 全屏模式：

• 会话管理：支持查看管理多个历史对话，自动保存历史记录思考模式：支持推理模型的深度思考，提供更准确的解决方案

• 多模型支持：兼容各种 OpenAI 兼容格式 AI 模型，提供模型设置界面自由添加选择模型服务

• 集成平台更多的 MCP 工具（Chat 模式）工具调用：

3）简单配置，快速上手

平台设置：

• 设置模型服务：

• 支持通过 AI 插件的customCompatibleAIModels选项自定义添加 OpenAI 兼容格式大模型（使用 MCP 功能需要使用支持 tools 的大模型），建议使用 DeepSeek R1/V3、Qwen3、Gemini 等对视觉/工具支持良好的模型，优先使用满血模型、推理类型模型效果更好。

    // registry.js    export default {      // ......      [META_APP.Robot]: {        options: {          // encryptServiceApiKey: false, // 是否加密服务API密钥, 默认为false          // enableResourceContext: false, // 提示词上下文携带资源插件图片，默认true          // enableRagContext: true, // 提示词上下文携带查询到的知识库内容，默认false          customCompatibleAIModels: [{ // 自定义AI模型(OpenAI兼容格式模型), 下面以智谱模型服务为例            provider: 'GLM',            label: '智谱模型',            baseUrl: 'https://open.bigmodel.cn/api/paas/v4',            models: [              {                label: 'GLM视觉理解模型',                name: 'glm-4.5v',                capabilities: {                  vision: true, // 是否支持视觉理解能力                  reasoning: { extraBody: { enable: { thinking: { type: 'enabled' } }, disable: null } } // 是否支持深度思考及深度思考打开与关闭额外的body字段                }              },              {                label: 'GLM-4.5推理模型',                name: 'glm-4.5',                capabilities: {                  toolCalling: true,                  reasoning: { extraBody: { enable: { thinking: { type: 'enabled' } }, disable: null } }                }              }            ]          }]        }      }      // ......    }

可以通过对接最新后端服务使用完整的 AI 插件能力，或者也可以在前端项目配置 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/'),      },      '/app-center/api/ai/chat': {        target: 'https://dashscope.aliyuncs.com',        changeOrigin: true,        rewrite: path => path.replace('/app-center/api/ai/chat', '/compatible-mode/v1/chat/completions'),      },      ...originProxyConfig,    }

补充说明：截图生成 UI 能力由于依赖上传图片接口，需要启动后端服务，且需要使用支持视觉理解能力的模型，如 qwen-vl 系列模型

• 插件配置：

• 在插件中也提供了对部分功能的自定义能力，包括是否启用加密 API Key 解决安全风险问题、是否使用知识库 RAG 能力提供额外的知识背景提升问答对话效果、是否允许使用资源管理插件中的图片等：

       // registry.js    export default {      [META_APP.Robot]: {        options: {          // encryptServiceApiKey: false, // 是否加密服务API密钥, 默认为false          // enableResourceContext: false, // 提示词上下文携带资源插件图片，默认true          // enableRagContext: true, // 提示词上下文携带查询到的知识库内容，默认false          // modeImplementation: { // 支持通过注册表传入chat和agent模式的实现          //   chat: useCustomChatMode          //   agent: useCustomAgentMode          // }        }      }    }

用户设置：

• 配置服务与密钥：在设置面板编辑内置服务添加 API Key 或者添加自定义的模型服务

• 选择模型：可以从内置百炼、DeepSeek 或者自定义的模型服务中选择模型（图片生成 UI 需要多模态模型，MCP 工具调用需要支持工具调用模型）

• 开始使用：在输入框输入问题或者上传图片问答，同时可以自由切换 Agent/Chat 模式，配置 MCP 工具，开启深度思考等，从智能搭建到深度辅助，全方位提升您的开发效率。快来体验，释放您的创造力！

2.【新特性】添加资源管理插件和资源选择配置器

在应用开发中，通常会需要引用图片等资源，资源管理插件主要满足这类场景需求，可以上传项目中用到的静态资源，在编排页面或 AI 生成页面时引用（当前仅支持图片格式附件）。

2.1 资源管理

1）资源分组：资源管理插件通过分组管理资源，上传资源之前需要先创建分组，可以为不同场景的静态资源进行分组，比如基础图标库，或者也可以按模块分类

创建好分组后，点击分组名可以管理当前资源分组

2）添加资源

添加资源分为两种方式，输入 URL 和名称添加网络资源，上传图片或图标资源。其中资源名称必填，通过 url 添加的话 url 也必填，如果是上传的，则不能输入 url,支持上传 png、jpg、svg 文件，支持批量上传

3）修改资源

已添加资源的管理，hover 时显示名称，操作包括复制和删除，复制是复制添加完成后在用户服务器上的 url 地址

也支持批量操作，点击批量操作后，出现删除图标（后续还会扩展其他批量操作），且资源变为可多选的状态

2.2 资源使用

1）在画布中使用

可以通过图片组件使用资源，选中图片组件后在图片的属性设置处，点击选择资源可以设置为资源管理中的图片

效果

2）在 AI 插件中使用

在 AI 插件 Agent 模式生成页面时，页面中经常会需要使用到图片资源，AI 无法直接生成这些图片，默认会将当前资源管理插件的图片作为备用资源引入使用（仅使用带有描述介绍的图片）。例如“生成登录页面”自动引用背景图与 Logo：

如果不希望在 AI 助手插件中使用，可以通过修改注册表关闭

// registry.jsexport default {  [META_APP.Robot]: {    options: {      enableResourceContext: false, // 提示词上下文携带资源插件图片，默认true    }  }}

3. 【增强】预览插件支持应用预览

在之前的预览插件中只能够实现单页面的预览，对于需要在多个页面中交互跳转的场景无法满足。

在 v2.9 版本中，TinyEngine 支持了应用的全局预览，能够预览完整项目的效果，并且支持手动路由切换，也能够在调试模式下查看整个应用的源码。1）入口：

工具栏的预览图标进行了调整，直接点击图标与之前逻辑一致为页面预览，点击后面的箭头可打开下拉列表，可以选择应用预览

2）预览效果

打开预览页面后，可以看到应用预览与页面预览相比添加了路由切换栏，可以选择路由进行切换。

4. 【增强】Tailwindcss 支持

Tailwind CSS 是一种实用优先的 CSS 框架，提供丰富的原子类，如 text-center、p-4、bg-blue-500 等，可快速构建定制化、响应式界面。

低代码平台支持 Tailwind 后，用户在可视化搭建的同时，能直接通过类名精细控制样式，无需编写或配置大量样式即可实现高效美观的前端开发，提升灵活性与开发速度。

在 v2.9 以上版本，已默认支持 Tailwind CSS 框架。

启用后的行为

• 设计态：画布支持直接加载 Tailwind 样式类

• 预览态：自动按需加载  @tailwindcss/browser，使画布/预览中可直接使用 Tailwind 原子类。

• 出码生成：生成的应用将自动完成以下配置（基于 Tailwind CSS v4 零配置方案）：

• 在依赖中添加  tailwindcss，并在开发依赖中添加  @tailwindcss/vite；

• 在 Vite 配置中注册  tailwindcss()  插件；

• 生成  src/style.css，内容包含  @import "tailwindcss";；

• 在  src/main.js 自动引入  ./style.css。

以上步骤由引擎/出码器自动完成，无需手动干预。

效果

选中节点后在属性配置面板样式类中直接填写 Tailwind 样式类名，即可看到画布 Tailwind 样式生效：

关闭 Tailwind

可以通过注册表关闭 Tailwind 功能：

// registry.jsexport default {  'engine.config': {    // ...其他配置    enableTailwindCSS: true, // 开启（默认即为 true）；设为 false 可关闭  },};

当配置为 enableTailwindCSS: false 时：

• 预览态不会加载  @tailwindcss/browser；

• 出码时不会注入与 Tailwind 相关的依赖、Vite 插件及样式文件导入。

注意事项

• 预览依赖解析：内置 import-map 已包含 @tailwindcss/browser 映射；如使用自定义 CDN/离线环境，请确保该映射可用。

• 自定义样式：可在生成的 src/style.css 中追加自定义样式，或在项目中新增样式文件后自行引入。

• 运行时渲染：如果您自定义了运行时渲染引擎，请确保在运行时渲染中增加对 Tailwind CSS 的支持。

5.【增强】支持静态数据源

设计器提供数据源来配合画布上的组件/区块渲染，之前版本只支持采取远程 API 请求 JSON 数据动态获取的方式，自 TinyEngine v2.9+版本开始，支持静态数据源配置。

使用步骤

1）创建数据源，数据源类型选择静态数据源，配置数据源名称以及数据源字段，根据配置的数据源字段新增静态数据。

2）使用数据源 Mock 数据（数据源使用方式与远程数据源相同）

6.【增强】组件物料更新

• 修改路由选择配置器，添加标签栏配置器和导航组件

拖拽一个导航条组件到画布，可以更改导航条为横向或者纵向，导航菜单项支持增删改，菜单项支持配置跳转页面

• 更新物料 Icon（设计稿换新风格后，原物料图标跟页面风格不匹配，更换所有的物料图标）

• 添加 TinyVue 图表组件

物料面板新增 TinyVue 图表组件，主要包括折线图、柱状图、条形图、圆盘图、环形图、雷达图、瀑布图、漏斗图、散点图 等

• 添加 TinyVue 基础组件

• 表单类型中新增单选组、评分、滑块、级联选择器 组件

• 数据展示中新增骨架屏、卡片、日历、进度条、标记、标签、统计数值 组件

• 导航类型中新增步骤条和树形菜单组件

7. 【增强】MCP 工具更新

AI 助手除了新增的搭建模式，原有的对话模式也进行了增强，增加了若干个插件的 mcp 工具：

• 国际化（i18n） 相关 mcp 工具

• 应用状态、页面状态相关 mcp 工具

• 页面增删查改工具

• 节点操作相关 mcp 工具（节点选中、属性修改、增删节点等等）

如何使用：

当前可以升级到 v2.9 版本，切换到 chat 模式，即可在对话中使用 MCP 工具，AI 会自动调用相应工具。用户也可以手动点击关闭某个 mcp 工具。

示例图：

二次开发 TinyEngine 时，如何修改/添加/删除 mcp 工具？

当前 mcp 工具都默认随着插件的注册表导出（因为依赖插件的相关能力），所以如果需要修改/添加/删除 mcp 工具，修改注册表即可。

默认的插件注册表导出：

// mcp 工具 mcp/index.jsexport const mcp = {  tools: [getGlobalState, addOrModifyGlobalState, deleteGlobalState]}

// 插件注册表导出 index.jsexport default {  ...metaData,  entry,  metas: [globalStateService],  // mcp 的相关导出  mcp}

在二次开发工程中修改/添加 mcp 工具，同自定义注册表，请参考注册表相关文档。

未来优化：

• 添加、调优 mcp 工具

• 添加 chat 模式的系统提示词，让 AI 工具调用效果更好

8. 【其他】功能细节优化 &bug 修复

• 为 TinyGrid 配置添加版本字段 by @LLDLLY in opentiny/tiny-engine#1568
  

• 优化画布选项位置计算算法 by @chilingling in opentiny/tiny-engine#1572
  

• 从 props 解析区块依赖 by @chilingling in opentiny/tiny-engine#1602
  

• 修复 tinyvue 类型错误 by @chilingling in opentiny/tiny-engine#1623
  

• 修复用户目录句柄删除导致的生成失败 by @chilingling in opentiny/tiny-engine#1543
  

• 修复工具名称和导出名不一致问题 by @chilingling in opentiny/tiny-engine#1606
  

• 确保只有字符串 id 注册到 metaHashMap by @chilingling in opentiny/tiny-engine#1622
  

• 修复 ColorInput 内边距问题 by @chilingling in opentiny/tiny-engine#1595
  

• 修复子页面隐藏显示设置主页选项 by @chilingling in opentiny/tiny-engine#1544
  

• 修复 baseURL 移除斜杠问题 by @chilingling in opentiny/tiny-engine#1631
  

• 格式化工具调用结果 by @hexqi in opentiny/tiny-engine#1637
  

• 修复内置构建选项外部化问题 by @betterdancing in opentiny/tiny-engine#1646
  

• 修复绑定事件后高亮 JS 函数失败 by @chilingling in opentiny/tiny-engine#1656
  

• 修复画布组件边框/开关样式等问题 by @betterdancing in opentiny/tiny-engine#1649
  

• 修复 ImportMap 问题和改进变量绑定 by @betterdancing in opentiny/tiny-engine#1676
  

• 预览支持自定义 import-map by @chilingling in opentiny/tiny-engine#1669
  

• 修复初始化期间方法高亮失败 by @chilingling in opentiny/tiny-engine#1666
  

• 修复 parseFunction 空字符串处理问题 by @fayching in opentiny/tiny-engine#1677
  

• 更新生成代码模板依赖版本 by @chilingling in opentiny/tiny-engine#1620
  

• 删除 webcomponent 包 by @chilingling in opentiny/tiny-engine#1583
  

• 导出基础类型 by @chilingling in opentiny/tiny-engine#1692
  

• 文档更新

• 添加前后端 Docker 部署文档 by @lu-yg in opentiny/tiny-engine#1598
  

• 更新注册表代码示例 by @chilingling in opentiny/tiny-engine#1693
  

• 更新 AI 插件文档内容 by @hexqi in opentiny/tiny-engine#1712
  

以上是此次更新的主要内容

如需了解更多可以查看：v2.9.0 所有 changelog

结语

TinyEngine v2.9 的发布，不仅是功能层面的一次全面跃迁——从 AI 助手的能力增强、Tailwind CSS 的原生支持，到资源管理插件的引入、应用预览能力的落地——更是我们对“极致可定制”理念的又一次深化实践。每一个细节的打磨，每一次架构的演进，都旨在让开发者以更低的成本、更高的自由度，构建真正属于自己的低代码世界。

这不仅仅是一个版本的更新，更是社区共建成就的见证。我们相信，开源的意义不仅在于代码共享，更在于思想碰撞与协作共创。正是每一位用户的使用、反馈与贡献，让 TinyEngine 在真实场景中不断淬炼成长。

未来之路，我们继续同行。欢迎你持续关注 TinyEngine 的演进，参与社区讨论，提交你的想法与代码。让我们携手，把低代码的可能性推向更远的地方。

关于 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 标签，一起参与开源贡献~