
TypeScript Magician
FreeMaster TypeScript types and eliminate errors effortlessly.
Free · Opens the source repo
What TypeScript Magician does
TypeScript Magician is a specialized skill designed to assist developers in navigating the complexities of TypeScript's type system. This skill is particularly useful for those facing challenges with type errors, generics, and strict typing. It provides a structured approach to diagnosing and resolving TypeScript issues, ensuring that codebases are free from any types and adhere to strict type safety principles.
When invoked, TypeScript Magician runs a TypeScript compiler check to identify type errors before making any changes. This initial step captures the full scope of issues present in the code. The skill then guides users through understanding the root causes of these errors, whether they stem from unsound inference, implicit any types, or missing constraints. By utilizing advanced TypeScript features, the skill crafts precise solutions that enhance type safety and maintain the integrity of the code.
In addition to fixing type errors, TypeScript Magician educates users on the underlying type theory, providing multiple approaches to solving each problem. This includes demonstrating the differences between the original and refactored code, ensuring that users can see the improvements made. The skill also includes comprehensive type tests to validate that the changes made do not break existing functionality, all while ensuring full IntelliSense support for a smoother development experience.
Overall, TypeScript Magician is an invaluable tool for developers looking to deepen their understanding of TypeScript and improve the quality of their code. Whether you're dealing with complex generics or simply trying to eliminate any types, this skill provides the guidance and solutions needed to enhance your TypeScript projects.
When to use it
Use TypeScript Magician when you encounter TypeScript errors, need to eliminate `any` types, or face challenges with generics and type inference.
When not to use it
This skill may not be suitable for basic TypeScript tasks or projects that do not require strict typing or advanced type manipulation.
What you can build with it
Refactoring Legacy Code
Use TypeScript Magician to refactor legacy TypeScript code that heavily relies on `any` types, improving type safety and maintainability.
Resolving Complex Generics
When faced with complex generic types that lead to confusing type errors, invoke this skill for precise solutions and explanations.
Improving Type Safety in APIs
Utilize TypeScript Magician to ensure that API responses are correctly typed, reducing runtime errors and enhancing code reliability.
How to install TypeScript Magician
View source1. Install with the skills CLI
npx skills add mcollina/skills/typescript-magician --agent claude-code2. Or install it manually
Download the skill folder and drop it into ~/.claude/skills/ for all projects, or .claude/skills/ to scope it to one repo. Restart Claude Code so it picks up the new skill.
Anthropic's agentic coding CLI, and the reference implementation of Agent Skills. Drop a skill folder into ~/.claude/skills and Claude Code loads it automatically whenever a task matches the skill's description. Claude Code docs
Inside SKILL.md
Written by mcollinaWhen to use
Use this skill for:
- TypeScript errors and type challenges
- Eliminating
anytypes from codebases - Complex generics and type inference issues
- When strict typing is needed
Instructions
When invoked:
- Run
tsc --noEmitto capture the full error output before making changes - Identify the root cause of type issues (unsound inference, missing constraints, implicit
any, etc.) - Craft precise, type-safe solutions using advanced TypeScript features
- Eliminate all
anytypes with proper typing — validate each replacement still satisfies call sites - Confirm the fix compiles cleanly with a second
tsc --noEmitpass
Capabilities include:
- Advanced generics and conditional types
- Template literal types and mapped types
- Utility types and type manipulation
- Brand types and nominal typing
- Complex inference patterns
- Variance and distribution rules
- Module augmentation and declaration merging
For every TypeScript challenge:
- Explain the type theory behind the problem
- Provide multiple solution approaches when applicable
- Show before/after type representations
- Include comprehensive type tests
- Ensure full IntelliSense support
Quick Examples
Eliminating any with generics
Before
function getProperty(obj: any, key: string): any {
return obj[key];
}
After
function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {
return obj[key];
}
// getProperty({ name: "Alice" }, "name") → inferred as string ✓
Narrowing an unknown API response
Before
async function fetchUser(): Promise<any> {
const res = await fetch("/api/user");
return res.json();
}
After
interface User { id: number; name: string }
function isUser(value: unknown): value is User {
return (
typeof value === "object" &&
value !== null &&
"id" in value &&
"name" in value
);
}
async function fetchUser(): Promise<User> {
const res = await fetch("/api/user");
const data: unknown = await res.json();
if (!isUser(data)) throw new Error("Invalid user shape");
return data;
}
Reference
Read individual rule files for detailed explanations and code examples:
Core Patterns
- rules/as-const-typeof.md - Deriving types from runtime values using
as constandtypeof - rules/array-index-access.md - Accessing array element types using
[number]indexing - rules/utility-types.md - Built-in utility types: Parameters, ReturnType, Awaited, Omit, Partial, Record
Advanced Generics
- rules/generics-basics.md - Fundamentals of generic types, constraints, and inference
- rules/builder-pattern.md - Type-safe builder pattern with chainable methods
- rules/deep-inference.md - Achieving deep type inference with F.Narrow and const type parameters
Type-Level Programming
- rules/conditional-types.md - Conditional types for type-level if/else logic
- rules/infer-keyword.md - Using
inferto extract types within conditional types - rules/template-literal-types.md - String manipulation at the type level
- rules/mapped-types.md - Creating new types by transforming existing type properties
Type Safety Patterns
- rules/opaque-types.md - Brand types and opaque types for type-safe identifiers
- rules/type-narrowing.md - Narrowing types through control flow analysis
- rules/function-overloads.md - Using function overloads for complex function signatures
Debugging
- rules/error-diagnosis.md - Strategies for diagnosing and understanding TypeScript type errors
Frequently asked questions about TypeScript Magician
Similar skills
Quality Playbook Generator
Run comprehensive quality audits on any codebase.
PR Draft Summary
Automate PR summary generation for openai-agents-python.
Final Release Review
Streamline your release candidate audits with ease.
Unit Test Vue Pinia
Efficiently write and review unit tests for Vue 3 applications.
Slang Shader Expert
Optimize and integrate Slang shaders with ease.
Telemetry Standards
Ensure consistent event tracking in Supabase Studio.
