Engineering TypeScriptGenericsType System

TypeScript Pro

Advanced TypeScript patterns: generics, conditional types, mapped types, module augmentation, declaration files, and strict-mode migration guides.

A deep TypeScript expert that goes beyond basic annotations to master the type system itself. Covers conditional types, mapped types, template literal types, infer, declaration merging, and module augmentation. Guides codebases from loose JavaScript through incremental strict-mode adoption without breaking everything at once.

Added Mar 20, 2026

$npx skills add johnefemer/skillfish --skill typescript-pro

Capabilities Real Examples Get Started Models & Context Works Great With

What This Skill Can Do

Concrete capabilities you get when you install this skill.

Design complex generic utilities with conditional and mapped types

Write and publish declaration files (.d.ts) for untyped libraries

Migrate JavaScript codebases to strict TypeScript incrementally

Diagnose cryptic TS errors and explain the type inference chain

Augment third-party module types without forking upstream

Configure tsconfig.json for monorepos, libraries, and Next.js apps

Real Conversations

See how the TypeScript Pro skill responds to actual requests. These are representative examples of what your AI agent will produce.

You

I want a fully type-safe EventEmitter where the compiler enforces that emit('login', payload) matches the payload type registered for 'login'. How do I do this in TypeScript?

Agent

Use a mapped type over an event map interface to constrain both the event name and its payload simultaneously:

type EventMap = {
  login: { userId: string; timestamp: number };
  logout: { userId: string };
  error: Error;
};

class TypedEmitter<T extends Record<string, unknown>> {
  private listeners = new Map<keyof T, Set<(payload: T[keyof T]) => void>>();

  on<K extends keyof T>(event: K, handler: (payload: T[K]) => void): this {
    if (!this.listeners.has(event)) this.listeners.set(event, new Set());
    this.listeners.get(event)!.add(handler as (p: T[keyof T]) => void);
    return this;
  }

  emit<K extends keyof T>(event: K, payload: T[K]): void {
    this.listeners.get(event)?.forEach(h => h(payload as T[keyof T]));
  }
}

const emitter = new TypedEmitter<EventMap>();
emitter.on('login', ({ userId, timestamp }) => console.log(userId, timestamp));
emitter.emit('login', { userId: '123', timestamp: Date.now() }); // ✅
emitter.emit('login', { userId: '123' }); // ❌ TS error: missing 'timestamp'

The key insight: K extends keyof T threads through both on and emit, so the handler type and payload type are always linked to the same event key. No casting needed at call sites.

You

I'm getting TS error 'Type instantiation is excessively deep and possibly infinite' on my recursive type. It's a DeepPartial utility. What's wrong?

Agent

This error means TypeScript hit its recursion limit (default ~100 levels). The usual cause is an unconditional recursive reference. Fix it by adding a base case that breaks the cycle:

// ❌ Causes infinite instantiation on complex objects
type DeepPartialBad<T> = {
  [K in keyof T]?: DeepPartialBad<T[K]>;
};

// ✅ Add a base-case guard for primitives
type DeepPartial<T> = T extends object
  ? { [K in keyof T]?: DeepPartial<T[K]> }
  : T;

If the type is still too deep (e.g., deeply nested API responses), use an interface instead of a type alias — interfaces are lazily evaluated and defer recursive resolution:

interface DeepPartial<T> {
  [K in keyof T]?: T[K] extends object ? DeepPartial<T[K]> : T[K];
}

Two other tactics:

Add & object constraints to prevent primitives from recursing
Use // @ts-ignore only on the recursive line as a last resort, not on callers

The real fix 90% of the time is the T extends object guard. Primitives (string, number, Date) don't have keys, so without the guard TypeScript recurses into them forever.

Get Started

How to install and use this skill in your preferred environment.

Skills are designed for AI coding agents (Claude Code, Cursor, Windsurf) and IDE-based workflows where the agent can read files, run scripts, and act on your codebase.

Models & Context

Which AI models and context windows work best with this skill.

Recommended Models

Works best with Claude Sonnet 4 or GPT-4o — models that can reason about multi-level type inference and produce valid TypeScript without hallucinating syntax.

Context Window

SKILL.md is ~5KB. Fits in 32K context; for large declaration file work, 64K+ is recommended.

Pro tips for best results

1

Be specific

Include numbers — users, budget, RPS — so the skill can size the architecture.

2

Share constraints

Compliance needs, team size, and existing stack all improve the output.

3

Iterate

Start with a high-level design, then ask follow-ups for IaC, cost analysis, or security review.

4

Combine skills

Pair with companion skills below for end-to-end coverage.

Works Great With

These skills complement TypeScript Pro for end-to-end coverage. Install them together for better results.

Senior Frontend

React, Next.js, TypeScript, Tailwind CSS, accessibility, and performance.

FrontendReact

React Specialist

Advanced React patterns: Server Components, Suspense, concurrent rendering, custom hooks, state management, and performance optimization guides.

ReactServer Components

Next.js Developer

Next.js App Router mastery: Server/Client Components, route handlers, middleware, ISR, caching strategies, and deployment optimization.

Next.jsApp Router

Code Reviewer

Code review automation for TypeScript, JavaScript, Python, Go, Swift, Kotlin.

ReviewQuality

TDD Guide

Test-driven development workflow with test generation and multi-framework support.

TDDTesting

$ skillfish add johnefemer/skillfish --all # install all skills at once

Ready to try TypeScript Pro?

Install the skill and start getting expert-level guidance in your workflow — any agent, any IDE.