Standards Detection
Search for ESLint config (.eslintrc.*, eslint.config.*, package.json). If found, merge with baseline (ESLint takes precedence). Otherwise use baseline only.
Baseline Standards
Types & Imports
- Use
type(notinterface) - Use
import typefor type-only imports - Naming:
ComponentNameProps,UseHookNameOptions - Order: types → libraries → components → utilities → styles
Naming
| Element | Convention | Example |
|---|---|---|
| Components | PascalCase | UserProfile |
| Variables/functions | camelCase | getUserData |
| Constants | UPPER_SNAKE_CASE | MAX_RETRY_COUNT |
| Event handlers | on* | onClick |
| Hooks | use* | useAuth |
Components
- Functional components with arrow functions
- Destructure props with defaults
- Named exports preferred
- Set
displayName - Memoize:
useCallbackfor callbacks,useMemofor computations - Early returns for guards
- Conditional rendering with
&&
Custom Components
type ComponentNameProps = {}
export const ComponentName: FC<ComponentNameProps> = props => {
const {} = props
}
ComponentName.displayName = 'ComponentName'
Custom Hooks
export function useHookName(options: UseHookNameOptions) {
const { a, b } = options
// a, b
return {}
}
Code Style
- TypeScript strict mode
- Avoid
any→ useunknownor specific types - Prefer
constoverlet - Single responsibility functions