IDE 配置与 Rules 记忆体系

# Project: AI Video Platform
 
## Tech Stack
- Nuxt 4 (Vue 3.5+, Nitro, TypeScript)
- Drizzle ORM + PostgreSQL
- Tailwind CSS v4 + Nuxt UI
- pnpm monorepo (apps/web, apps/admin, packages/*)
 
## Code Style
- Always use `<script setup lang="ts">` for Vue components
- Use `defineProps` with TypeScript generics, not runtime declaration
- Use `useTemplateRef()` instead of template refs with string
- Use `$fetch` for client-side requests, `useFetch` for SSR-safe data fetching
- Use `import.meta.client` / `import.meta.server` guards, NEVER `process.client`
- All API handlers use Zod validation with `readValidatedBody`
 
## File Conventions
- API routes: `server/api/[resource]/[id].[method].ts`
- Composables: `composables/use[Name].ts` (auto-imported)
- Components: PascalCase, `.client.vue` suffix for client-only
- Types: `packages/shared/types/[domain].ts`
 
## Architecture Rules
- Server state: Drizzle queries in API handlers, NEVER direct DB access from client
- Auth: `requireAuth(event)` in all protected API routes
- Caching: `defineCachedEventHandler` for read-heavy, rarely-changing data
- Error handling: `createError({ statusCode, message })` for API errors
 
## Common Mistakes to Avoid
- Do NOT use `ref()` for props destructuring, use `defineProps` with reactive destructure
- Do NOT use `v-html` with user input
- Do NOT import from `vue` what Nuxt auto-imports (`ref`, `computed`, `watch`, etc.)
- Do NOT use `useAsyncData` when `useFetch` suffices (useFetch = useAsyncData + $fetch)
- Do NOT forget to handle SSR hydration mismatches for browser-only components

# 差：
Use best practices for error handling.
 
# 好：
All API handlers must:
1. Validate input with Zod: `readValidatedBody(event, schema.parse)`
2. Throw errors with: `createError({ statusCode: 400, message: 'xxx' })`
3. Wrap external API calls in try-catch with specific error messages

# 差：
Use the Nuxt data fetching pattern.
 
# 好：
## Data Fetching Pattern
 
Server-rendered pages:
```vue
<script setup>
const { data } = await useFetch('/api/videos', {
  query: { page: 1 },
  transform: (res) => res.items,
})

const result = await $fetch('/api/videos', {
  method: 'POST',
  body: { title: 'xxx' },
})

<!-- .cursor/rules/api-routes.md -->
---
globs: ["server/api/**/*.ts"]
---
 
# API Route Rules
- Every handler must start with auth check: `const session = await requireAuth(event)`
- Use `readValidatedBody(event, schema.parse)` for POST/PUT
- Use `getQuery(event)` for GET parameters
- Return typed objects, never raw database rows
- Always include pagination for list endpoints: `{ items, total }`

<!-- .cursor/rules/vue-components.md -->
---
globs: ["**/*.vue"]
---
 
# Vue Component Rules
- Use `<script setup lang="ts">` exclusively
- Props: `defineProps<{ ... }>()` with TypeScript generics
- Emits: `defineEmits<{ ... }>()` with TypeScript generics
- Template refs: `useTemplateRef<HTMLElement>('name')`
- Client-only logic: wrap in `onMounted` or use `.client.vue` suffix

# AI Video Platform
 
## Project Structure
pnpm monorepo with:
- `apps/web` - Nuxt 4 user-facing app (SSR)
- `apps/admin` - Nuxt 4 admin dashboard (SPA)
- `packages/database` - Drizzle ORM schema and migrations
- `packages/shared` - Shared types and utilities
- `packages/ui` - Shared UI components (Nuxt Layer)
 
## Commands
- `pnpm dev` - Start dev server (apps/web)
- `pnpm build` - Build for production
- `pnpm test` - Run all tests
- `pnpm typecheck` - TypeScript type check
- `pnpm lint` - ESLint check
- `pnpm db:migrate` - Run database migrations
- `pnpm db:generate` - Generate migration from schema changes
 
## Code Style
- TypeScript strict mode, no `any` unless unavoidable
- Vue: `<script setup lang="ts">`, Composition API only
- API: Zod validation, typed responses, proper error codes
- Database: Drizzle ORM, never raw SQL in application code
 
## Git Conventions
- Conventional Commits: `feat:`, `fix:`, `refactor:`, `docs:`, `test:`
- One logical change per commit
- Run `pnpm typecheck && pnpm test` before committing

<!-- packages/database/CLAUDE.md -->
# Database Package
 
## Schema Location
All schemas in `schema/` directory, one file per domain entity.
 
## Schema Conventions
- Table names: snake_case plural (`videos`, `ai_tasks`)
- Column names: snake_case (`created_at`, `user_id`)
- Primary key: `text('id').$defaultFn(() => createId())`
- Timestamps: `created_at` and `updated_at` with defaults
- Foreign keys: always define `.references(() => table.column)`
- Indexes: define at table level with `pgTable` index option
 
## Migration
After schema changes, run: `pnpm db:generate`
Review generated SQL in `drizzle/` before applying.

<!-- .claude/commands/add-feature.md -->
---
description: "Add a new feature end-to-end"
---
 
When adding a new feature:
1. Create/update database schema in `packages/database/schema/`
2. Generate migration: run `pnpm db:generate`
3. Create API routes in `server/api/`
4. Create composable in `composables/`
5. Create page/component in `pages/` or `components/`
6. Run `pnpm typecheck` to verify types
7. Run `pnpm test` to verify tests pass
8. Commit with `feat: [description]`

<!-- .windsurfrules -->
# Nuxt 4 AI Video Platform
 
## Framework
Nuxt 4 with TypeScript, Nitro server, Drizzle ORM, Tailwind CSS v4.
 
## Key Patterns
- Data fetching: `useFetch` for SSR pages, `$fetch` for client actions
- State: Pinia stores for complex state, `useState` for simple shared state
- Auth: `nuxt-auth-utils`, session-based, `requireAuth()` server middleware
- Validation: Zod schemas for all API input
 
## File Structure
server/api/[resource]/index.get.ts   → List
server/api/[resource]/[id].get.ts    → Detail
server/api/[resource]/index.post.ts  → Create
server/api/[resource]/[id].put.ts    → Update
server/api/[resource]/[id].delete.ts → Delete

#!/bin/bash
# scripts/sync-rules.sh
CORE=$(cat .ai/core-rules.md)
 
# 生成 .cursorrules
echo "$CORE" > .cursorrules
cat .ai/cursorrules.md >> .cursorrules
 
# 生成 CLAUDE.md
echo "$CORE" > CLAUDE.md
echo "" >> CLAUDE.md
echo "## Claude Code Specific" >> CLAUDE.md
cat .ai/claude-specific.md >> CLAUDE.md

# AI Video Platform - Cursor Rules
 
## Tech Stack
- **Framework**: Nuxt 4 (Vue 3.5+, TypeScript strict)
- **Server**: Nitro with Node.js preset
- **Database**: PostgreSQL + Drizzle ORM
- **UI**: Tailwind CSS v4 + Nuxt UI
- **Auth**: nuxt-auth-utils (session-based)
- **Monorepo**: pnpm workspace
 
## Vue Components
- Always `<script setup lang="ts">`
- Props: `defineProps<{ prop: Type }>()` with TS generics
- Emits: `defineEmits<{ (e: 'update', value: string): void }>()` 
- Refs: `useTemplateRef<HTMLElement>('name')`
- Never import auto-imported composables: ref, computed, watch, onMounted, etc.
 
## Data Fetching
- SSR pages: `const { data } = await useFetch('/api/...')`
- Client actions: `await $fetch('/api/...', { method: 'POST', body: {} })`
- Never use axios or fetch directly
 
## API Routes
- Path: `server/api/[resource]/[id].[method].ts`
- Auth: `const session = await requireAuth(event)`
- Validation: `const body = await readValidatedBody(event, schema.parse)`
- Errors: `throw createError({ statusCode: 400, message: '...' })`
- Caching: `defineCachedEventHandler` for read-heavy endpoints
 
## Database
- Schema: `packages/database/schema/[entity].ts`
- Always use Drizzle query builder, never raw SQL in app code
- Relations: define in schema with `relations()`
- IDs: `text('id').$defaultFn(() => createId())`
 
## SSR Safety
- Browser APIs: guard with `import.meta.client` or use `.client.vue`
- Dynamic imports: `const Lib = await import('lib')` in onMounted
- No `window`, `document`, `localStorage` without client guard
 
## Don't
- Don't use Options API
- Don't use `process.client` (use `import.meta.client`)
- Don't use `v-html` with user content
- Don't put business logic in components (use composables)
- Don't access database from client-side code