SuperAPI AI Directory

migrate-js-to-modern-typescript

Coding & development

View repository

Updated 10-16 03:46

About this skill

JavaScript to TypeScript Migration Best Practices

Guide for taking a JavaScript codebase to strict, modern TypeScript without a big-bang rewrite. Contains 42 rules across 7 categories, prioritized by impact to drive an incremental, file-by-file migration that keeps the build compiling at every step.

When to Apply

Reference these guidelines when:

  • Converting a .js codebase to .ts (whole project or one module at a time)
  • Adding types to existing JavaScript via JSDoc or annotations
  • Choosing a tsconfig and allowJs strategy for a mixed JS/TS repo
  • Turning on strict mode or individual strict flags on a large codebase
  • Replacing any, as casts, and ! assertions left over from a quick conversion
  • Validating external data (JSON, env, API responses) so the types you wrote are true at runtime
  • Converting CommonJS to ESM, prototypes to classes, and other JS idioms to TS
  • Updating the build, runner, and CI to type-check and publish TypeScript

How the Migration Flows

tsconfig & strategy → strictness ratchet → type the surfaces → kill any/casts
   → validate runtime boundaries → convert JS idioms → tooling/build/CI

Decisions at the front cascade: a wrong tsconfig or a top-down conversion order forces you to re-type modules twice, and an early any flood poisons everything downstream. Work from the front of this pipeline and from the leaves of the dependency graph inward.

Rule Categories by Priority

Priority Category Impact Prefix
1 Migration Setup & tsconfig CRITICAL setup-
2 Strictness Ratcheting CRITICAL strict-
3 Typing Public Surfaces HIGH surface-
4 Replacing any & Unsafe Casts HIGH unsafe-
5 Runtime Data Validation MEDIUM-HIGH runtime-
6 JS-to-TS Idiom Conversion MEDIUM idiom-
7 Tooling & Build Migration LOW-MEDIUM tooling-

Quick Reference

1. Migration Setup & tsconfig (CRITICAL)

2. Strictness Ratcheting (CRITICAL)

3. Typing Public Surfaces (HIGH)

4. Replacing any & Unsafe Casts (HIGH)

5. Runtime Data Validation (MEDIUM-HIGH)

6. JS-to-TS Idiom Conversion (MEDIUM)

7. Tooling & Build Migration (LOW-MEDIUM)

How to Use

Read individual reference files for detailed explanations and code examples:

Related Skills

  • typescript-refactor — Refactoring and modernizing code that is already TypeScript
  • typescript-advanced-patterns — Advanced type-level patterns once the migration is done

Reference Files

File Description
references/_sections.md Category definitions and ordering
assets/templates/_template.md Template for new rules
metadata.json Version and reference information