TickYouOff
Sign in
Back
🔷

JS to TypeScript Migration Checklist

Hard 16 items · 2 hours
testuser's avatar
testuser Published 1 month ago
Technical

A focused, practical checklist to guide teams or solo devs through migrating a JavaScript codebase to TypeScript. Covers tsconfig setup, incremental file renames, third-party types, CI checks, and cleanup steps.

Progress
0 / 16
  1. Install TypeScript and initialize tsconfig.json — npm i -D typescript; run npx tsc --init to create a starter tsconfig.json.
  2. Configure tsconfig and review strict settings — Start with a strict baseline and plan which flags to enable now vs later.
  3. Set 'strict': true in tsconfig.json — Enable the umbrella strict flag to opt into multiple safety checks.
  4. Enable noImplicitAny and strictNullChecks — Turn on noImplicitAny and strictNullChecks, then list hotspots to fix.
  5. Enable allowJs and checkJs for gradual migration — Set allowJs: true and optionally checkJs: true to type existing JS files incrementally.
  6. Rename .js/.jsx files to .ts/.tsx in small batches — Use feature branches and small PRs to minimize reviewer overhead and conflicts.
  7. Install @types packages or typed alternatives for dependencies — npm i -D @types/pkg or switch to packages that bundle types to avoid missing types.
  8. Add custom declaration files for untyped modules — Create src/types.d.ts or a types/ folder and declare module 'untyped-lib' as needed.
  9. Address noImplicitAny hotspots with explicit types — Add parameter/return types, interfaces, or temporary any annotations sparingly.
  10. Refactor common shapes using utility types and generics — Use Partial, Pick, Omit, ReturnType and generics to reduce duplication.
  11. Update bundler and build configs for .ts/.tsx — Configure ts-loader, babel-preset-typescript, or relevant plugins to compile TS.
  12. Add TypeScript type checking step to CI — Add npx tsc --noEmit (or yarn tsc --noEmit) to CI to fail on type errors.
  13. Update test runner setup and rename tests to .ts/.tsx — Configure ts-jest or babel-jest and update test configs to handle TypeScript.
  14. Enable incremental compilation and set tsBuildInfoFile — Turn on incremental:true and specify a tsbuildinfo file to speed subsequent builds.
  15. Configure ESLint for TypeScript and run autofix — Install @typescript-eslint/parser and plugin, lint and autofix to catch style/type issues.
  16. Remove allowJs and tighten tsconfig once codebase is typed — Run a full type check, remove allowJs, and re-enable strict flags as final cleanup.
Sign in to save
📝 My Notes