Trae：不写一行代码生成精美艺术网站
Trae简介
Trae 是字节跳动推出的 国内首个 AI 原生集成开发环境（AI IDE），专为开发者设计，深度融合 AI 技术以提升编程效率。
它有以下亮点：
- AI 深度集成
- Builder 模式：通过自然语言描述需求，AI 可自动分解任务、生成端到端代码项目，支持实时预览和交互式调整。
- Chat 模式：支持多轮对话提问，可针对代码库进行优化建议、Bug 修复和功能扩展。
- 智能代码补全与审查：基于上下文理解生成精准代码，支持多语言（Python、Java、Go 等）。
- 多模型支持
- 国内版：最新版本已支持：Claude-3.5-sonnet，Claude-3.7-sonnet，GPT-4o，DeepSeek（V3&R1）。
- 中文场景优化
- 原生中文界面，深度适配中文开发习惯，支持自然语言指令（如“帮我写一个登录接口”）。
- 轻量级与扩展性
- 提供基础的 IDE 功能（代码管理、版本控制等），支持插件扩展（Trae 使用 open-vsx 作为插件源）。
生成网站
这里我选取了一个网站作为案例：
使用Builder模式，模型使用Claude-3.7-sonnet
添加图片并输入需求：
这里AI让我运行命令创建项目
一键运行不需要我们操作：
这里直接报错了🤣，我认为AI这里思考复杂了，直接创建文件夹就行了
我们不进行任何提示，看它能不能自我纠正过来
在经过几轮的错误后终于意识到问题了，最后也是创建好了项目
接下来就是自动生成源文件，生成的代码提示需要审查，直接全部接受
全部生成完毕，速度还是很快的，几分钟就好了
生成结果
直接打开index.html看下效果：
图片是没法生成的，但图片的路径已经命名好了，我们手动放上图片。
我们提供的案例只有图片，但AI自己添加了一些细节：
另外还有About和Contact页面我们没有提供样例，AI根据前面的风格自己生成了，效果也不错
该有的细节也没落下：
最后对比下：
经过对比可以看出，AI还原程度有80%左右，另外AI可以根据已有的页面扩展新的页面，美中不足的是AI无法帮助我们生成图片等资源文件，并且生成的字体也有所限制。
总结
通过AI技术与开发流程的深度融合，Trae编辑器展现了强大的项目生成能力：如在本文中仅上传三种设计素材（如UI截图或原型图）并输入自然语言指令，即可实现端到端的全自动代码生成，首次输出的项目效果便高度还原设计意图，无需人工干预或反复调试。该工具的交互体验同样令人印象深刻——其深度集成的AI系统通过Chat与Builder双模式实现智能协作，开发者可通过对话式交互实时调整生成结果，并预览代码变更效果。作为专为中文开发者优化的IDE，Trae不仅提供全中文界面降低使用门槛，还免费开放Claude-3.7-Sonnet，GPT-4o，DeepSeek等顶尖模型，同时兼容VS Code插件生态，可通过扩展机制满足多样化开发需求。
