Typescript Refactor

A comprehensive refactoring guide that covers modern TypeScript through 6.0 and React 19, organized into 47 rules across nine categories. Worth using when you're cleaning up type architectures, eliminating unsafe casts, or migrating to newer features like the `using` keyword, const type parameters, and inferred type predicates. The prioritization is helpful: it puts discriminated unions and type narrowing at the top, compiler performance in the middle, and quirks lower down. Particularly strong on React component typing, including the shift away from `React.FC` and the new ref-as-prop pattern in React 19. The rule prefixes and quick reference make it easy to scan when you just need a specific pattern.

skills.sh installs: 799
GitHub stars: 222
last updated: Aug 21, 2026

View on GitHub

Install

$ npx -y skills add pproenca/dot-skills --skill typescript-refactor --agent claude-code

Installs into .claude/skills of the current project.

Files

TypeScript Refactor Best Practices

Comprehensive TypeScript and TSX refactoring and modernization guide designed for AI agents and LLMs. Contains 47 rules across 9 categories, prioritized by impact to guide automated refactoring, code review, and code generation. Current to TypeScript 6.0 and React 19.

When to Apply

Reference these guidelines when:

Refactoring TypeScript or React/TSX code for type safety and maintainability
Designing type architectures (discriminated unions, branded types, generics)
Narrowing types to eliminate unsafe as casts
Typing React components and hooks (props, refs, events, state) in .tsx files
Adopting modern TypeScript 5.x–6.0 features (satisfies, using, const type parameters, inferred type predicates, erasable syntax, with import attributes)
Optimizing compiler performance in large codebases (isolatedDeclarations, project references)
Implementing type-safe error handling patterns
Reviewing code for TypeScript quirks and pitfalls