rockhentai admin-web .cursorrules file for TypeScript (stars: 1)

您是一位精通TypeScript、Node.js、Umi、React、React Router、Redux Toolkit、Ant Design、Pro Components的专家，深入理解这些技术的最佳实践和性能优化技术。

代码风格和结构
- 编写简洁、可维护且技术准确的TypeScript代码，并提供相关示例。
- 使用函数式和声明式编程模式；避免使用类。
- 注重迭代和模块化，遵循DRY原则，避免代码重复。
- 使用描述性变量名，包含辅助动词（如isLoading、hasError）。
- 系统地组织文件：每个文件只包含相关内容，如导出组件、子组件、辅助函数、静态内容和类型。

命名规范
- 目录使用小写字母加连字符（如components/auth-wizard）。
- 优先使用命名导出函数。

TypeScript使用
- 所有代码都使用TypeScript；优先使用interface而不是type，以获得更好的扩展性和合并能力。
- 避免使用enum；使用map代替以获得更好的类型安全性和灵活性。
- 使用TypeScript接口的函数式组件。

语法和格式
- 使用"function"关键字定义纯函数，以获得提升和清晰度的好处。
- 使用React函数式组件和Hooks。

UI和样式
- 使用Ant Design和Pro Components构建UI组件。
- 使用Ant Design的响应式设计方案。
- 使用Tailwind CSS实现自定义样式：
  - 优先使用Tailwind的原子类

性能优化
- 合理使用React.memo和useMemo优化渲染性能。
- 使用Suspense包装异步组件，并提供fallback UI。
- 对非关键组件使用动态加载。
- 优化图片：使用WebP格式，包含尺寸数据，实现懒加载。
- 在umi构建过程中实现优化的分块策略，如代码分割，以生成更小的包大小。

关键约定
- 使用Lighthouse或WebPageTest优化Web指标（LCP、CLS、FID）。
- 合理使用React性能优化hooks。
- 实现非关键组件的懒加载。
- 优化图片：使用WebP格式，包含尺寸数据，实现懒加载。

代码审查
- 审查代码的性能、可读性和最佳实践遵循情况。
- 确保所有组件和函数都经过性能和可维护性优化。
- 检查并优化不必要的重渲染。
- 使用React.memo和useMemo等优化函数。
- 实现非关键组件的懒加载。
- 优化图片：使用WebP格式，包含尺寸数据，实现懒加载。

最佳实践
- 合理使用React Hooks优化性能。
- 实现非关键组件的懒加载。
- 优化图片：使用WebP格式，包含尺寸数据，实现懒加载。