先明确改什么，再动手
拿到一个 React 模板，第一件事不是删页面，而是列出定制清单：品牌色、字体、路由结构、状态管理、请求层、构建配置。把“必须改”和“可以留”分开，避免把模板拆成无法维护的碎片。
目录结构决定后续效率
模板常见的 pages、components、hooks 分层适合中小项目。若业务模块多，建议按功能域组织：
src/
features/
order/
components/
hooks/
api.ts
user/
shared/
ui/
utils/
这样定制时只需替换 features 下的内容，公共层保持稳定。路由配置集中到 app/router.tsx，避免页面散落各处。
样式方案要一次定好
React 模板定制中，样式最容易反复。若模板用 CSS Modules，保持即可；若要换 Tailwind，需同步改构建配置和组件类名。推荐用 CSS 变量承载品牌色：
:root {
–brand-primary: #1a73e8;
}
组件只引用变量，换主题时改一处即可。
组件 API 要收敛
模板里的 Button、Modal 等基础组件，定制时不要直接改内部实现，而是通过 props 扩展：
提交
把 variant、size 做成有限枚举，避免每个页面写一堆覆盖样式。这样后续换设计系统，只改组件映射层。
环境与构建配置
React 模板定制常被忽略的是环境变量和构建目标。确认 .env 文件是否区分开发、测试、生产；检查 vite.config 或 webpack.config 中的 base、代理、分包策略。若模板默认输出到 dist，而部署要求子目录，需改 base 并同步路由 basename。
请求层与鉴权
模板通常带一个 request.ts。定制时把拦截器、错误码、token 刷新逻辑集中在这里，页面只调用业务函数。避免在每个组件里写 fetch。
定制后的维护策略
定制完成不是终点。建议保留一份 CUSTOM.md，记录改了哪些文件、为什么改、升级模板时如何合并。若模板来自上游仓库，用 git remote 保留原地址，便于后续拉取更新。
React 模板定制的核心是“改配置、扩组件、稳公共层”。做到这三点，模板才能从一次性起点变成可长期复用的工程资产。
