#回答规范
|
#用来确定AI的回答是否是在我定义的规则内
|
每次回答我的问题时，都要叫我亲爱的龙傲天大人
|
|
#代码风格规范
|
#React组件规范
|
- 组件文件使用大驼峰命名（PascalCase），如：UserProfile.tsx
|
- 组件内部函数使用小驼峰命名（camelCase）
|
- 组件props类型必须使用TypeScript接口定义
|
- 组件必须包含清晰的JSDoc注释，说明组件的用途和props含义
|
- 组件内部状态使用useState或useReducer管理
|
- 复杂逻辑必须抽离到自定义Hook中
|
|
#目录结构规范
|
- src/api：接口请求统一管理，按模块分类
|
- src/components：可复用组件，按功能模块分类
|
- src/views：页面级组件，按路由模块分类
|
- src/utils：工具函数，按功能分类
|
- src/styles：全局样式和主题配置
|
- src/assets：静态资源，按类型分类（images/icons等）
|
- src/router：路由配置，包含路由守卫
|
- src/status：状态管理，使用Context或Redux
|
|
#样式规范
|
- 使用Less预处理器
|
- 样式文件与组件同名，使用.module.less后缀
|
- 全局样式变量统一在styles/variables.less中管理
|
- 移动端适配使用rem或vw单位
|
- 组件样式必须使用CSS Modules避免样式污染
|
|
#TypeScript规范
|
- 必须为所有props定义类型
|
- 使用interface定义对象类型
|
- 使用type定义联合类型和工具类型
|
- 避免使用any类型，必要时使用unknown
|
- 使用泛型增强代码复用性
|
|
#性能优化规范
|
- 使用React.memo优化组件重渲染
|
- 使用useMemo和useCallback缓存计算结果和函数
|
- 列表渲染必须使用key属性
|
- 大数据列表使用虚拟滚动
|
- 图片资源必须进行压缩和懒加载
|
|
#钉钉开发规范
|
- 钉钉API调用必须进行错误处理
|
- 钉钉环境判断必须使用utils中的统一方法
|
- 钉钉主题适配必须使用dingtalk-theme
|
- 钉钉组件必须使用dingtalk-design-mobile
|
|
#Git提交规范
|
- feat: 新功能
|
- fix: 修复bug
|
- docs: 文档更新
|
- style: 代码格式调整
|
- refactor: 代码重构
|
- test: 测试用例
|
- chore: 构建过程或辅助工具的变动
|
|
#注释规范
|
- 组件文件头部必须包含作者、时间、版本等信息
|
- 复杂逻辑必须添加详细注释
|
- 工具函数必须包含参数和返回值说明
|
- 接口定义必须包含字段说明
|
- 关键业务逻辑必须添加注释说明
|
|
#测试规范
|
- 组件必须包含单元测试
|
- 工具函数必须包含单元测试
|
- 关键业务逻辑必须包含集成测试
|
- 测试文件与源文件同名，使用.test.ts后缀
|
- 测试覆盖率要求达到80%以上
|
|
#安全规范
|
- 敏感信息必须加密处理
|
- 用户输入必须进行验证和转义
|
- API请求必须进行错误处理
|
- 避免在前端存储敏感信息
|
- 使用HTTPS进行数据传输
|
|
#文档规范
|
- README必须包含项目说明、安装步骤、开发指南
|
- 组件必须包含使用示例
|
- API接口必须包含参数说明
|
- 工具函数必须包含使用说明
|
- 项目更新必须更新CHANGELOG
|
|
#工具函数引入规范
|
#utility.js工具函数自动引入规则
|
- 当代码中需要使用以下功能时，必须自动引入utility.js中的对应方法：
|
|
1. 环境判断和配置
|
- isDebug, isTest, appUrl, title 等环境变量
|
- 引入方式：import { isDebug, isTest, appUrl, title } from '../utils/utility';
|
|
2. 日期时间处理
|
- dateFormat, timeFormat, minuteFormat, myTimeFormat 等日期格式化
|
- getQuarter, getBeforeDate, getCountTime 等日期计算
|
- msgTime, tipTime, getweekTime 等时间显示
|
- 引入方式：import { dateFormat, timeFormat, getQuarter } from '../utils/utility';
|
|
3. 表单验证
|
- checkTel, checkIdCard 等验证方法
|
- verification, verificationLong, verificationSwf 等表单校验
|
- 引入方式：import { checkTel, checkIdCard, verification } from '../utils/utility';
|
|
4. UI交互
|
- showToast, confirmModal, confirmTwoButtonModal, confirmThreeButtonModal 等弹窗
|
- info, infoSuccess, infoError 等消息提示
|
- 引入方式：import { showToast, confirmModal, info } from '../utils/utility';
|
|
5. 本地存储
|
- setLocal, getLocal, clearLocal 等localStorage操作
|
- setSessionStorage, getSessionStorage, clearSessionStorage 等sessionStorage操作
|
- 引入方式：import { setLocal, getLocal, setSessionStorage } from '../utils/utility';
|
|
6. 地址处理
|
- gainRegionDesc, gainRegionCode, gainnewRegionCode 等地址处理
|
- regionThreeDesc, regionThreeCode 等三级联动
|
- 引入方式：import { gainRegionDesc, regionThreeDesc } from '../utils/utility';
|
|
7. 文件处理
|
- openFiles 文件预览和下载
|
- 引入方式：import { openFiles } from '../utils/utility';
|
|
8. 钉钉相关
|
- loginModal 登录状态处理
|
- 引入方式：import { loginModal } from '../utils/utility';
|
|
9. 数据处理
|
- modifyArray, flattenNestedArray 等数组处理
|
- ellipsis, sensitiveTitle 等字符串处理
|
- noToChinese, checkIsNum 等数字处理
|
- 引入方式：import { modifyArray, ellipsis, noToChinese } from '../utils/utility';
|
|
10. 身份证信息提取
|
- getSexByIdcard, getBirthdatByIdNo, getAgeByIdcard 等身份证信息处理
|
- 引入方式：import { getSexByIdcard, getBirthdatByIdNo, getAgeByIdcard } from '../utils/utility';
|
|
#工具函数使用规范
|
- 优先使用utility.js中已有的工具函数，避免重复造轮子
|
- 使用工具函数时必须进行错误处理
|
- 工具函数的参数必须符合类型要求
|
- 工具函数的返回值必须进行空值判断
|
- 涉及敏感信息的工具函数必须进行加密处理
|
- 涉及钉钉环境的工具函数必须进行环境判断
|
|
#工具函数扩展规范
|
- 新增工具函数必须添加到utility.js中
|
- 新增工具函数必须添加JSDoc注释说明
|
- 新增工具函数必须包含参数类型说明
|
- 新增工具函数必须包含返回值说明
|
- 新增工具函数必须包含使用示例
|
- 新增工具函数必须进行单元测试
|
