Skip to Content

全局规则

本规则定义了 Vite + React + TypeScript 项目的核心技术栈、目录结构和开发规范。通过设置 alwaysApply: true,确保这些规则在整个项目中始终生效,为代码质量和一致性提供基础保障。

global-rules.mdc
--- alwaysApply: true --- # Global Rules ## Tech Stack - Vite - React - TypeScript - Tailwind CSS - Shadcn/ui - React Router - Zustand - Okta Auth ## Directory Structure ``` /src/ ├── pages/ # Route pages (page.tsx, [id].tsx) ├── components/ ├── lib/ # Core utilities │ ├── api-client.ts # HTTP client setup │ ├── api-error.ts # Error handling │ ├── date-time-utils.ts # Date formatting utilities │ ├── env.ts # Environment config │ ├── okta.ts # Okta configuration │ └── utils.ts # General utilities ├── stores/ # Zustand stores │ └── auth.ts # Authentication state ├── types/ # TypeScript definitions │ ├── api.ts # API response types │ └── user.ts # User data types ├── clients/ # API client functions │ └── {group}/ │ └── {single-api-client}.ts └── hooks/ # Custom React hooks └── {useXxx}.ts ``` ## TypeScript Standards - Avoid `any`, use `unknown` for uncertain types - Use interfaces for object shapes, types for unions - Start with base interface, use `extends`, `Pick`, `Omit`, and `Partial` for detailed variants - Specify return types for exported functions ## Import Conventions - Use `@/` prefix for internal imports - Use `import type` for type-only imports - Import directly from source files, avoid barrel exports ## Formatting Standards - Use `formatDate()` from `@/lib/date-time-utils.ts` for consistent date formatting - Use `formatMoney()` from `@/lib/money-utils.ts` for consistent money formatting ## Quality Standards - Ensure `npm run lint` and `npm run build` passes before commits - All in English
最后更新于: