我是谁，以及我遇到了什么问题
我是一名前端开发，日常主要做 Vue3 + Vite 网页应用开发，平时会写一些自用小工具页面。 本次的具体任务：需要做一个倍投策略计算器网页工具，包含参数表单、计算核心逻辑、结果表格渲染、边界校验，还要配套简单单元测试；页面不需要复杂后端，纯前端运行。 痛点：
- 数学计算逻辑分支多，手写容易算错，调试各种输入边界很耗时间；
- UI 要简单清爽，表单、结果表格、提示文案都要配套；
- 自己从零写，要搭页面、写计算函数、处理异常输入、补单测，整套做下来开销不小，属于自用工具，不想投入过多时间。
我是怎么用 TraeCode 解决这件事的
使用模式：IDE 模式，在现有 Vue3 项目内开发，没有使用 SOLO 完整接管。
第一步：让 TraeCode 理解项目结构与完整需求 提示词：
当前项目是 Vue3 + Vite + setup 语法糖，新建一个页面组件，开发倍投策略计算器。需求：支持输入初始本金、倍率、止损止盈、最大轮次；根据倍投公式自动生成每一轮本金、盈亏、累计收益；做输入校验，禁止负数、0 等非法参数；渲染结果表格；增加重置按钮；编写核心计算函数的单元测试；样式简洁适配浏览器。先通读项目现有组件风格，输出整体实现思路。
操作：把项目上下文交给 TraeCode，让它先分析现有项目的编码规范，输出整体方案，确认方案没问题再开始写代码。
第二步：定位新建文件，输出完整组件代码 提示词：
在 views 目录新建 BetCalculator.vue，按照刚才的方案完整实现页面组件，拆分 UI 模板、响应式数据、核心计算方法、表单校验方法，不要合并成一坨代码，函数做拆分。
操作：TraeCode 直接生成完整 Vue 单文件组件，包含 template 模板、样式、js 逻辑；我简单浏览结构，确认文件路径、命名符合项目规范。
第三步：辅助调试、修复逻辑 bug、补充边界与单测 提示词：
现在运行出现问题：部分边界输入下计算结果异常，比如最大轮次为 1 的时候输出错误。帮我排查计算函数逻辑，修复异常分支；同时给核心计算函数编写 vitest 单元测试，覆盖正常输入、边界值、非法输入场景。
操作：它定位到循环终止条件的漏洞，修改计算函数；同时输出对应的单测代码，粘贴到测试文件；我本地运行，复现问题→修复→运行单测用例。中间有几处 UI 细节不符合预期，直接描述视觉要求，迭代调整样式。
第四步：整理变更，完成可直接提交的代码 提示词：
汇总本次所有改动，列出新增文件清单，梳理变更说明，检查是否有 console 调试垃圾代码、硬编码敏感数据，清理产物，输出可以直接 git 提交的版本。
操作：核对新增页面组件、测试文件；删除残留调试打印；本地完整跑通页面，表单输入、计算、重置、异常提示全部正常，单测全部通过。
成果展示
- 交付产物：新增
BetCalculator.vue页面组件 + vitest 单元测试用例；集成进现有 Vue3 项目，路由配置完成，可以直接访问使用。 - 功能完整：参数表单输入校验、倍投核心计算、轮次结果表格展示、重置清空、异常输入提示；核心计算逻辑有单元测试覆盖各类边界。
- 现状：已经在本地环境跑通投入自用，用来快速推演倍投策略数据；代码可以直接提交仓库，后续也可以继续迭代扩展功能。
效率对比
以前怎么做： 自己从零开发：搭页面布局、写表单、手写复杂数学计算逻辑，反复核对公式对错，手动造各种边界数据调试，再手写单元测试。整套功能完整跑通，大概需要 2.5‑3 小时，其中大量时间耗在排查计算逻辑错误、手写重复表单校验。
现在用 TraeCode 怎么做： 通过 IDE 模式，先定方案，生成代码，针对 bug 迭代修复，补单测。整体从需求到完整可用版本，耗时 40 分钟左右。 大部分时间不再消耗在写模板、写计算公式，更多是做方案确认、校验结果正确性、微调细节。
经验和技巧总结
- 做工具类页面，一定要一开始就把全部约束、边界条件写进提示词，比如禁止 0、负数、最大最小限制，否则后续会冒出很多逻辑 bug。
- 这种带有数学计算逻辑的场景，优先让它顺带生成单元测试，单测可以帮你快速校验公式是否正确，比手动反复填表单测试高效很多。
- IDE 模式适合在已有项目新增小页面 / 工具，不要直接让它大改很多旧文件；如果是从零全新项目，SOLO 模式会更合适。
- 需求描述不要只说 “做一个计算器”，要把输入什么、输出什么、有哪些限制完整讲清楚，减少来回返工。