AI读取前端项目生成skill.md

可以,你的目标不是让 Trae CN 直接"乱总结",而是让它读取整个前端项目后,沉淀一份以后 AI 修改代码必须遵守的项目说明书 ,也就是 skill.md

你可以按这个流程做:

一、先用 Trae CN 打开前端项目

在项目根目录打开 Trae CN,例如你的前端项目一般会有这些文件:

复制代码
复制代码
package.json
src/
vue.config.js 或 vite.config.js
.env.development
.env.production
public/

然后切换到 Agent 模式,让它能读取项目文件。


二、先让 Trae CN 扫描项目,不要马上生成

第一步先发这个:

复制代码
复制代码
请你先完整分析当前前端项目结构,但不要修改任何代码。

重点分析:
1. 项目使用的是 Vue2 还是 Vue3
2. 使用的是 Vue CLI 还是 Vite
3. 路由结构在哪里
4. 接口请求封装在哪里
5. 权限、菜单、字典、枚举是怎么处理的
6. 页面一般放在哪里
7. 公共组件放在哪里
8. 样式规范是什么
9. 表格、弹窗、查询表单、分页一般怎么写
10. 新增/编辑/详情页面的通用写法
11. 这个项目里 AI 修改代码时最容易踩坑的地方

只分析,不生成文件。

这样做的好处是:先让它"读懂项目",避免直接生成一堆空泛内容。


三、确认它分析没问题后,再让它生成 skill.md

然后继续发这个:

复制代码
复制代码
基于你刚才对当前前端项目的分析,请帮我生成一份专属于本项目的 skill.md 文件。

这个 skill.md 的用途是:
以后我使用 Trae CN、Claude Code、ChatGPT、DeepSeek 等 AI 工具修改这个前端项目时,让 AI 先读取 skill.md,再按照本项目的规范改代码。

要求:
1. 内容必须基于当前项目真实代码,不要编造不存在的目录、组件、方法。
2. 用中文编写,方便团队成员阅读。
3. 重点写清楚本项目的技术栈、目录结构、接口请求方式、页面开发规范、组件使用规范、样式规范、字典使用规范、权限处理规范。
4. 要写清楚"AI 修改代码时必须遵守的规则"。
5. 要写清楚"禁止事项",例如不要随意重构、不要改动无关逻辑、不要删除原有注释、不要擅自改变接口字段。
6. 要结合项目里的真实示例文件路径。
7. 输出为 Markdown 格式。
8. 最后给我一个完整的 skill.md 文件内容,我可以直接复制保存。

请按照下面结构生成:

# 项目 AI 开发 Skill

## 1. 项目概述
## 2. 技术栈
## 3. 目录结构说明
## 4. 启动与构建命令
## 5. 路由规范
## 6. 接口请求规范
## 7. 页面开发规范
## 8. 组件使用规范
## 9. 表格、查询、分页规范
## 10. 新增、编辑、详情弹窗规范
## 11. 字典与枚举使用规范
## 12. 权限控制规范
## 13. 样式规范
## 14. AI 修改代码必须遵守的规则
## 15. 禁止事项
## 16. 常见任务处理方式
## 17. 修改代码后的自检清单

四、让 Trae CN 直接创建文件

如果你希望它直接创建文件,可以接着说:

复制代码
复制代码
请将上面生成的内容保存到项目根目录下的 skill.md 文件中。

注意:
1. 不要修改其他任何文件。
2. 如果项目根目录已经存在 skill.md,请先读取原文件内容,然后在不丢失原内容的基础上进行完善。
3. 保存完成后告诉我文件路径。

五、以后每次让 AI 改代码前,先加一句

以后你让 Trae CN 改项目代码时,开头加一句:

复制代码
复制代码
请先读取项目根目录下的 skill.md,并严格按照其中的项目规范修改代码。
本次只修改和需求相关的文件,不要改动无关逻辑。

比如:

复制代码
复制代码
请先读取项目根目录下的 skill.md,并严格按照其中的项目规范修改代码。

需求:
搜索框与复选框需要联动。
当搜索框已有内容时,重新勾选复选框,需要带上搜索框内容一起查询。
其他逻辑不要改动。
请分析相关页面后给出完整修改代码。

六、skill.md 里面最重要的是这几类内容

你这个前端项目建议重点让它总结这些:

复制代码
复制代码
1. 项目是 Vue2 还是 Vue3
2. 使用 Element UI 还是 Element Plus
3. request 请求封装文件位置
4. api 文件统一写法
5. router 路由文件位置
6. views 页面目录结构
7. components 公共组件目录
8. 字典接口怎么调用
9. 表格分页参数怎么传
10. 新增、编辑、详情弹窗怎么写
11. 权限按钮怎么控制
12. 样式是 scoped、scss 还是全局样式
13. 修改代码时哪些东西不能动
相关推荐
doiito11 小时前
左脚踩右脚:让 LLM 自进化的 Agent 轨迹训练法——为什么它能补上主流范式的最后一块拼图
ai·系统设计
带刺的坐椅20 小时前
从 Claude Code 隐私争议,看 SolonCode 的设计选择
ai·llm·agent·claudecode·soloncode·codingplan
冬奇Lab1 天前
Workflow 系列(03):状态管理——持久化、幂等性与版本绑定
人工智能·工作流引擎
冬奇Lab1 天前
每日一个开源项目(第146篇):openpilot - 开源自动驾驶辅助系统,曾在 Consumer Reports 评测中超过特斯拉 Autopilot
人工智能·开源·自动驾驶
吴佳浩1 天前
AI 工程师知识地图:模型格式、框架、部署工具一次讲明白
人工智能·aigc·ai编程
kyriewen1 天前
我手写了一个 EventEmitter,面试官追问了 6 个问题——第 4 个我没答上来
前端·javascript·面试
IT_陈寒1 天前
Java的Date类又坑了我一次,改用时间戳真香
前端·人工智能·后端
码农胖大海1 天前
AI额度不够用的解决方案
人工智能
lincats1 天前
Claude Code项目越写越乱?这套清理流程能救你
ai·ai agent·claude code