AI | 字节跳动 AI 中文IDE编辑器 Trae 初体验

Trae 简介与安装

🔦 什么是 Trae

Trae 是大厂字节跳动出品的国内首个 AI IDE，深度理解中文开发场景。AI 高度集成于 IDE 环境之中，为你带来比 AI 插件更加流畅、准确、优质的开发体验。说是能够不用写代码，全靠一张嘴跟 AI 聊天就把项目做起来，确实要试试，看看以后的抢走码农饭碗的到底是什么东西🤭。

Trae 自带豆包、DeepSeek 大模型，目前支持 windows、MAC 平台，linux 也在加速落地ING👍。

📦 安装

从官网下载最新的安装包，双击🛫：

选择自己喜欢的主题，我比较喜欢暗色😎：

接着导入配置，支持导入 VSCode 的配置，平滑过渡😄：

我们可以添加命令行，也就是在终端/Terminal 中使用命令trae启动，个人觉得没啥必要：

好了，一切就绪，开始 Trae 的使用之旅吧！此处建议注册并登录😁。

编辑器布局如下：

🛠️ 从零开始创建项目

首先我们切换到 Builder 模式：

输入我们项目的基本信息：

根据提示一步步操作，我在安装依赖时报错：

此时需要修改正确的版本号😂。

接着我们生成 rsbuild 的配置文件rsbuild.config.js：

import { defineConfig } from '@rsbuild/core';
import { pluginVue } from '@rsbuild/plugin-vue';

export default defineConfig({
    plugins: [pluginVue()],
    source: {
        entry: {
            index: './src/main.js'
        }
    },
    html: {
        template: './index.html'
    },
    output: {
        distPath: {
            root: 'dist'
        }
    }
});

接下来，创建第一个页面，继续给 Trae 描述我们的需求：

可以看到创建出来的页面是有模有样的，不过还有以下小问题：

1. 没有用到我们依赖的Naive UI组件库（可能是没在提示词中注明）
2. 启动命令还是用npm，我以及在前面多番强调要用pnpm😔

我们试下让页面使用 Naive UI 组件：

达到了预期效果👍。我们通过pnpm dev命令启动项目，可以看到如下的效果：

继续让 Trae 帮我们写一个登录页面：

总结

简单试用下来，Trae 能够处理简单的工作，但是细节还有待提升。对老手来说，并没有自己动手复制粘贴快。

而且，还有一些问题：

1. 有时候会碰到文件在人工修改后，下次由 AI 修改被覆盖的情况😂
2. 配置路由（vue-router）时，暂不能很好的生成正确的代码

总之目前 Trae 还是一个不够成熟的工具，期待它不断强大起来。