TraeCode 插件市场上线：让 AI Coding 连接更多工具

TraeCode 插件市场正式上线

首批精选插件（Plugins）及技能（Skills），覆盖开发工具｜调研分析｜界面设计｜效率提升

现在，你可以直接把外部工具和服务接进 TraeCode，让 AI 带着代码上下文一起调用

TraeCode 插件市场正式上线。通过插件，开发者可以直接发现、启用和调用不同插件，把原本分散在外部的工具与服务接入 AI Coding 流程。

这意味着，当你在 TraeCode 里发起一个开发任务，AI 不仅可以理解代码、修改文件、排查问题，还可以根据任务需要调用已经启用的插件能力，获取外部信息或使用专业工具，再继续完成后续工作。从“帮你写代码”，到“调用更多工具把开发任务往前推进”。

插件能帮你做什么？我们实测了 3 个场景

文中提示词可直接复用

场景 1：把产品想法变成可交互原型

有了产品想法，不一定要先画流程图、搭页面，再一个个补交互。在 TraeCode 中启用原型生成类插件后，可以直接描述产品类型、页面结构、视觉风格和交互需求。比如：

提示词：

帮我做一个【点餐小程序】的可交互高保真原型，包含 5 个页面：首页、分类菜单、商品详情、购物车、结算。
视觉风格：【橙白配色、圆角卡片、清爽简洁】。
首页：顶部搜索栏 + 轮播图 + 今日推荐列表；
分类菜单页：左侧分类栏 + 右侧商品列表；
商品详情页：大图 + 价格 + 规格选择 + 加入购物车；
购物车页：可增减数量、显示合计；
结算页：地址 + 支付方式 + 提交订单。
要求：所有按钮和卡片可点击跳转，页面之间可来回导航，底部 Tab 固定。用 HTML + CSS + JavaScript 实现，输出单个 index.html，打开即可运行。

推荐插件：快速产品原型开发 Prompt-to-Prototype 插件

TraeCode 可以结合插件能力，继续完成页面设计与代码实现，最终生成一个可直接运行的交互原型。从自然语言需求，到可以点击体验的 Demo，想法不必停留在描述里，可以直接跑起来。这个场景也可以快速替换成预约挂号、在线教育、会员商城等不同产品，用来验证一个新的产品想法。

场景 2：没有设计稿，也能从零生成视觉界面

开发一个新页面时，不一定每次都有现成设计稿。这次我们直接从一句视觉需求开始：

提示词：

请设计一个【科技感】的【AI 产品官网首页】，配色以【深蓝 + 青色渐变】为主。
要求：
1) 顶部导航（Logo + 4 个栏目 + 1 个按钮）；
2) 首屏大标题与副标题，背景为渐变 + 网格光效；
3) 下方三列产品特性卡片；
4) 底部 CTA 区块；
5) 整体现代、留白充足。输出为单页 HTML/CSS，可直接打开。

推荐插件：前端设计工具集、前端设计

通过界面设计、前端设计类插件，TraeCode 可以把文字中的风格、布局和模块要求进一步转化为页面，并生成可以直接打开的 HTML/CSS。想换一种感觉，也不用从头再来。“科技感”可以换成“温馨”，“AI 产品官网”可以换成“宠物领养平台”，“深蓝 + 青色渐变”也可以直接改成“奶油白 + 浅粉”。

从 0 到 1 做界面，先把想象中的样子做出来，再继续迭代。

场景 3：数据可视化看板原型

如果要快速做一个数据产品 Demo，过去往往要先准备数据、选图表、搭布局，再逐个调样式。这次我们把需求直接交给 TraeCode：

提示词：

做一个【销售数据看板】原型页面，用于内部演示。
要求：
1) 顶部 4 个 KPI 卡片（今日销售额、订单量、客单价、转化率），数据用 Mock 值并标注“示例数据”；
2) 中间放一张【近 30 天销售趋势】折线图；
3) 下方放【品类占比】环形图和【渠道排行】条形图；
4) 图表用【ECharts】实现；
5) 整体浅色简洁风格。输出单个 HTML 文件，可直接打开。

推荐插件：数据准备工作台、web数据可视化

借助数据准备和 Web 数据可视化类插件，TraeCode 可以继续完成数据组织、页面设计和图表实现，生成一份带交互图表的看板原型。

销售数据也只是一个例子。换成用户增长、内容运营、物流时效等数据，同样可以快速搭出一个用于讨论和演示的可视化 Demo。

以前需要在数据工具、设计工具和代码之间来回切换，现在可以从一句需求开始，把这些能力串起来。

让 AI Coding 更连贯

做一个产品，除了写代码，你还可能需要查资料、处理数据、设计页面，或者使用各种专业工具。以前，这些事情往往要在不同平台完成：打开工具、找到信息、复制结果，再回到 TraeCode 继续开发。现在，通过插件，可以直接在 TraeCode 中调用这些能力。你只需要描述要完成的任务，TraeCode 就能结合当前上下文和已启用的插件继续处理。

少一些工具之间的来回切换，让一个任务从开始到完成更连贯。

插件市场的价值因此不只是“多了一个工具入口”。更重要的是，让更多开发工具真正进入 AI Coding 的任务链路。

找到插件，直接调用起来

使用方式也很简单：

1. 打开 TraeCode，进入「插件市场」
2. 浏览或搜索需要的插件
3. 安装并启用插件
4. 回到 TraeCode，用自然语言描述你的任务
5. TraeCode 将结合当前任务与插件能力继续完成工作

从原型设计、界面生成，到数据可视化，更多专业能力正在进入 TraeCode。

TraeCode 插件市场现已上线。打开 TraeCode 并升级至最新版本，把你需要的工具接进来，让 AI Coding 继续往前一步。

本文作者@TRAE.ai，。原文链接：https://mp.weixin.qq.com/s/_18no053HGcjnB578mijWQ