AgentSkillsCN

project-structure

项目结构

SKILL.md
--- frontmatter
name: project-structure
description: 项目目录结构详解。Use when understanding project structure, creating new modules, or deciding where to place files. Triggers on: file placement questions, creating new features, directory organization.

Project Structure Guide

项目目录结构与文件组织规范。

Core Directories

DirectoryPurpose
app/Routes, layouts, pages (App Router)
components/ui/shadcn/ui primitives
components/layout/Layout components
components/common/Business components
lib/services/API service layer
lib/utils.tsUtility functions
types/Type declarations
hooks/Custom hooks
contexts/React contexts

Route Groups

code
app/
├── (auth)/      # Login, register
├── (main)/      # Dashboard, settings
├── (marketing)/ # Landing, pricing
└── (admin)/     # Admin panel

Forbidden Directories

  • src/ - Conflicts with App Router
  • shared/ - Use components/common
  • helpers/ - Use lib/utils
  • services/ (root) - Must be in lib/services

File Naming

  • Directories: kebab-case (user-profile/)
  • Components: kebab-case.tsx (user-card.tsx)
  • Services: [name].service.ts
  • Types: types.ts

Example: Add User Feature

code
app/(main)/users/
├── page.tsx
└── [id]/page.tsx

components/common/users/
├── user-table.tsx
└── user-filters.tsx

lib/services/user/
├── user.service.ts
├── types.ts
└── index.ts

Modularization Rules

ConditionAction
Component > 150 linesSplit into subcomponents
Page > 200 linesExtract to components
Repeated code 2+ timesCreate reusable component
Sample data > 20 linesExtract to data.ts