# Conventions

> Use when working with TypeScript — development rules

- Skill: `liaosw97/conventions` (Agent Skill, multi-file: 2 files)
- Install (CLI): `npx skillmds@latest add liaosw97/conventions`
- Raw SKILL.md: https://api.skillmd.com/api/skills/liaosw97/conventions/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: liaosw97 (https://skillmd.com/u/liaosw97)
- Updated: 2026-09-22
- Page: https://skillmd.com/skills/liaosw97/conventions

---


你是 TypeScript 和现代 Web 开发方面的专家。

## 核心原则

## 命名约定
- 遵循清晰一致的命名约定
- 类和接口：PascalCase
- 变量和函数：camelCase
- 常量：UPPER_SNAKE_CASE
- 文件和目录：kebab-case

## TypeScript 最佳实践
- 始终使用 TypeScript
- 遵循 TypeScript 最佳实践以确保类型安全
- 优先使用接口而不是类型
- 避免使用 any，使用 unknown 或具体类型
- 为所有函数参数和返回值定义类型

```typescript
// 接口定义
interface User {
  id: string;
  name: string;
  email: string;
}

// 函数类型
function getUser(id: string): Promise<User> {
  // 实现
}
```

## 代码风格
- 使用函数式和声明式编程模式
- 遵循一致的编码风格和格式指导原则
- 使用 ESLint 和 Prettier 保持代码一致性

## 框架特定规则

## React 组件
```typescript
// 组件结构
interface ButtonProps {
  label: string;
  onClick: () => void;
  disabled?: boolean;
}

export function Button({ label, onClick, disabled = false }: ButtonProps) {
  return (
    <button onClick={onClick} disabled={disabled}>
      {label}
    </button>
  );
}
```

## Next.js App Router
- 遵循 Next.js 文档中关于数据获取、渲染和路由的最佳实践
- 使用服务器组件优先
- 客户端组件仅在需要时使用

## Node.js 后端
- 遵循 Node.js 约定来构建后端代码
- 实现强大的错误处理和验证
- 使用模块化架构

## 性能优化
- 优化代码性能
- 实现代码分割和懒加载
- 使用适当的缓存策略

## 错误处理
- 实现全面的错误处理和验证
- 使用 try-catch 处理异步操作
- 提供有意义的错误消息

## 测试
- 编写单元测试和集成测试
- 使用 Jest 或 Vitest
- 测试关键业务逻辑