前端开发规则
前端开发相关的 Cursor AI 编程规则集合。
React
| 规则 | 说明 |
|---|---|
| react-typescript | React + TypeScript 开发规范 |
| nextjs-typescript | Next.js + TypeScript 开发规范 |
| nextjs-basic | Next.js 基础开发规范 |
| nextjs-tailwind | Next.js + Tailwind CSS 开发规范 |
| nextjs-supabase | Next.js + Supabase 全栈开发 |
| nextjs-14-seo | Next.js 14 SEO 优化 |
| nextjs-ui | Next.js UI 组件开发 |
| nextjs-react-ts | Next.js React TypeScript 配置 |
| react-query | React Query 数据获取规范 |
| react-components | React 组件开发规范 |
| styled-components | Styled Components 样式方案 |
| mobx | MobX 状态管理规范 |
| chakra-ui | Chakra UI 组件库规范 |
| apollo-graphql | Apollo GraphQL 客户端规范 |
Vue
| 规则 | 说明 |
|---|---|
| nuxt3 | Nuxt 3 开发规范 |
| composition-api | Vue Composition API 规范 |
Angular
| 规则 | 说明 |
|---|---|
| angular-typescript | Angular TypeScript 开发规范 |
| angular-typescript-guide | Angular TypeScript 指南 |
TypeScript
| 规则 | 说明 |
|---|---|
| conventions | TypeScript 编码约定 |
| axios | Axios HTTP 客户端规范 |
| vite-tailwind | Vite + Tailwind CSS 规范 |
其他框架
| 规则 | 说明 |
|---|---|
| solidjs-basic-guide | SolidJS 基础指南 |
| sveltekit-tailwind-typescript-guide | SvelteKit + Tailwind + TypeScript |
| micro-frontend | 微前端架构规范 |
| chrome-extension-dev-js-typescript | Chrome 扩展开发规范 |
使用方法
- 点击规则链接，在 GitHub 上查看
.cursorrules文件 - 复制内容到项目根目录的
.cursorrules文件 - 在 Cursor AI 中启用项目规则
- 开始编码，AI 将遵循规则生成代码