JS to TypeScript Migration Checklist

16 items · Technical · Hard difficulty · 2 hours

Step-by-step tasks to migrate a JavaScript codebase to TypeScript.

• Install TypeScript and initialize tsconfig.json

  npm i -D typescript; run npx tsc --init to create a starter tsconfig.json.

• Configure tsconfig and review strict settings

  Start with a strict baseline and plan which flags to enable now vs later.

• Set 'strict': true in tsconfig.json

  Enable the umbrella strict flag to opt into multiple safety checks.

• Enable noImplicitAny and strictNullChecks

  Turn on noImplicitAny and strictNullChecks, then list hotspots to fix.

• Enable allowJs and checkJs for gradual migration

  Set allowJs: true and optionally checkJs: true to type existing JS files incrementally.

• Rename .js/.jsx files to .ts/.tsx in small batches

  Use feature branches and small PRs to minimize reviewer overhead and conflicts.

• Install @types packages or typed alternatives for dependencies

  npm i -D @types/pkg or switch to packages that bundle types to avoid missing types.

• Add custom declaration files for untyped modules

  Create src/types.d.ts or a types/ folder and declare module 'untyped-lib' as needed.

• Address noImplicitAny hotspots with explicit types

  Add parameter/return types, interfaces, or temporary any annotations sparingly.

• Refactor common shapes using utility types and generics

  Use Partial, Pick, Omit, ReturnType and generics to reduce duplication.

• Update bundler and build configs for .ts/.tsx

  Configure ts-loader, babel-preset-typescript, or relevant plugins to compile TS.

• Add TypeScript type checking step to CI

  Add npx tsc --noEmit (or yarn tsc --noEmit) to CI to fail on type errors.

• Update test runner setup and rename tests to .ts/.tsx

  Configure ts-jest or babel-jest and update test configs to handle TypeScript.

• Enable incremental compilation and set tsBuildInfoFile

  Turn on incremental:true and specify a tsbuildinfo file to speed subsequent builds.

• Configure ESLint for TypeScript and run autofix

  Install @typescript-eslint/parser and plugin, lint and autofix to catch style/type issues.

• Remove allowJs and tighten tsconfig once codebase is typed

  Run a full type check, remove allowJs, and re-enable strict flags as final cleanup.

Printed from TickYouOff — the interactive version tracks your progress and can be shared with others.