重构是长期迭代项目的必要动作，需识别高优先级模块（如多useeffect、含temp/flag命名、注释“临时方案”的文件及污染的数据层api），重命名函数与组件以明确语义和场景，按业务域重组目录结构，并提取可复用逻辑为独立hook。
☞☞☞AI 智能聊天, 问答助手, AI 智能搜索, 多模态理解力帮你轻松跨越从0到1的创作门槛☜☜☜
当你在Trae中维护一个长期迭代的项目时，函数名写成handleClick1、getData2这类模糊命名，组件文件散落在src/components和src/pages夹杂着utils里，逻辑耦合严重——重构不是锦上添花，是让下一次改需求不翻车的必要动作。
识别需重构的核心模块
打开项目根目录下的src文件夹，逐个检查.tsx或.ts文件：凡是有超过3个useEffect、状态变量名含temp/flag/res、注释写着“临时方案”的文件，全部标记为高优先级重构对象。
重点扫描services/目录下所有API调用函数——如果某个fetchUserList函数里混着错误提示弹窗逻辑、loading状态管理、甚至直接操作localStorage，说明数据层已严重污染，必须拆离。
重命名：从语义模糊到意图明确
方法一：动词+名词+场景后缀
把handleSubmit改为submitLoginForm，把getData改为fetchUserProfileById。函数名必须让人一眼看出它只做一件事、作用在哪块业务里。
方法二：组件名遵循PascalCase+功能域
将index.tsx重命名为UserProfileCard.tsx，Modal.tsx重命名为ConfirmDeleteModal.tsx。禁止出现ComponentA、TempModal这类名称。
【重命名前务必关闭所有IDE自动导入提示】否则VS Code可能在你改名时自动插入旧路径引用，导致编译报错却找不到源头。
结构重组：按关注点分层，而非技术类型
第一步：新建src/features目录，按业务域建子文件夹，例如auth、dashboard、settings。
第二步：把原src/components/UserList及其配套hook、样式、测试文件，整体移入src/features/user-management/，内部结构固定为：components/、hooks/、api/、types.ts。
第三步：删除src/utils目录，其中与业务强相关的工具函数（如formatCurrency）移到对应feature的lib/子目录；纯通用函数（如debounce）才保留在新设的src/lib中。
这一步操作起来很简单，直接拖拽文件夹就行，但注意：移动前先确认所有相对路径导入语句是否同步更新，尤其import { X } from '@/utils'这类别名路径会失效。
提取可复用逻辑到独立Hook
方法一：状态逻辑抽离
将组件内重复出现的const [loading, setLoading] = useState(false) + try/catch块，封装成useAsyncAction，接收执行函数和成功回调，返回{ loading, execute }。
方法二：副作用逻辑抽离
把多个组件里都写的useEffect(() => { document.title = title }, [title])，统一为useDocumentTitle，传入字符串即可生效。
方法三：表单逻辑抽离
遇到带校验、重置、提交状态的表单，立刻创建useFormState，传入初始值和校验规则对象，返回values、errors、handleChange等标准接口。
