做程序任务发布的网站,wordpress实现mp4播放器,百度做的网站字体侵权,外贸营销员Trae AI IDE 全网最全的使用教程
近期#xff0c;字节发布了一款 AI Coding 产品 —— Trae#xff0c;它是一款对标 Cursor 和 Windsurf 的全新 IDE#xff0c;也是一款真正为中文开发者量身定制的工具#xff0c;可谓是中文开发者的福音。 其优雅的 UI、丝滑的交互、母语…Trae AI IDE 全网最全的使用教程
近期字节发布了一款 AI Coding 产品 —— Trae它是一款对标 Cursor 和 Windsurf 的全新 IDE也是一款真正为中文开发者量身定制的工具可谓是中文开发者的福音。 其优雅的 UI、丝滑的交互、母语级的支持、更高的 AI 集成度、更然自的交式互对话开发、更精准的 AI 生效成果都让你感到亲切和惊艳 它不再是一个工具而是一个能 “思考” 和 “共创” 的协作者帮助你更灵活的调用 AI 参与项目实现更高效率、更好效果的开发体验。
一、安装下载
去到 https://www.trae.ai/ 官网点击Download下载 到本地安装的时候会提示是否要导入配置这里可以选择
从VS Code导入从Cursor导入 接着可以选择安装Trae命令 然后可以选择跳过或者登录账号 首次使用这个平台的话可以注册账号并登录登录成功之后可以看到下面这个界面的提示 在这里可以更改这个配置的语言一般默认的是中文但一般开发都习惯于用英文。 二、功能区 主要分为四大块区域 最左边的侧边栏: Explorer 选择文件Search 搜索Git git仓库WebView 网页预览Debug 调试代码Extension Store 插件市场 第二块区域的文件区 显示所有的文件层次结构 最中间最大的代码编辑区 最右侧的AI 交互提问区 Builder 模式只需要告诉 AI 你想要什么样的应用它会轻松完成从零到一的项目构建Chat 模式AI 将理解当前代码你可以随时提出问题、寻求建议。此外也支持编辑器内实时提供建议代码
三、编辑工程代码
这里以前端工程代码为例打开一个React工程代码首次打开的时候会需要选择信任这个作者 3.1 提示运行前端工程代码
首先运行这个工程代码直接在Chat模式里输入 帮忙运行这个React 项目 然后就可以看到输出如下信息所示提示要
npm installnpm start由于这个项目用的是vite构建工具所以一开始提示的用npm start启动会报错于是继续提示 这里运行的构建工具是vite用npm start启动会报错 然后点击这个Open WebView就会在WebView这里打开一个窗口运行端口这里就可以看到页面的预览效果了。 3.2 改造样式
比如想要改造上述按钮的颜色为蓝色则在Builder模式下去输入 修改这个count is 0按钮的背景色为蓝色 然后就可以看到输出的内容和修改的文件 在修改的文件那里会看到提示”更改已经成功被应用了请确认“可以点击
Reject 拒绝Accept 同意 在未点击确认之前这里新增代码的背景色会是绿色。
点击Accpet之后再次运行可以看到下面按钮的背景色已经变成了蓝色。 3.3 增加交互
比如想要在点击这个按钮之后增加一个dialog的弹窗提示输入这样的命令可以看到提示修改的代码 其中点击对应要修改的提示代码文件的Review就可以跳转去对应的文件 可以看到
要删除的代码未确认之前是红色背景要新增的代码未确认之前是绿色背景 点击Accept之后再次运行看到效果如下所示
点击这个按钮确实新增了一个弹窗组件并提示对应的信息。 四、一些使用技巧和细节
如果想要复制自己上次输入的整个上下文信息则需要点击左边这三个点选择Copy 参考链接
【1】https://zhuanlan.zhihu.com/p/22846588982
