TS2322

Type 'X' is not assignable to type 'Y'

TypeScript TS2322 fires when you try to assign a value to a variable, return it from a function, or set it as a prop where the types don't match. It's the assignment-side counterpart to TS2345.

Why This Happens

The type of the value on the right side of an assignment is incompatible with the declared type on the left side. Common cases: assigning a wider type (string | null) to a narrower one (string), wrong return type, or mismatched React prop types.

Code That Triggers TS2322

// TS2322 examples

// Basic assignment mismatch
let name: string = 42;
// Error: Type 'number' is not assignable to type 'string'

// Null/undefined mismatch
let userId: number = null;
// Error: Type 'null' is not assignable to type 'number'
// (with strictNullChecks enabled)

// Return type mismatch
function getAge(): number {
  return "thirty"; // Error: Type 'string' is not assignable to type 'number'
}

// React prop mismatch
<Button onClick="handleClick" />
// Error: Type 'string' is not assignable to type '() => void'

How to Fix TS2322

Option 1: Fix the value to match the declared type

let name: string = "Alice"; // was 42, now "Alice"
function getAge(): number { return 30; } // was "thirty"

Option 2: Widen the declared type to accept the value

let userId: number | null = null; // accept null explicitly
let result: string | number = getResult(); // accept both

Option 3: Narrow before assigning from a union

const raw: string | null = fetchName();
const name: string = raw ?? "default"; // provide fallback for null

Frequently Asked Questions — TS2322

What is the difference between TS2322 and TS2345?

TS2322 occurs on assignment (variable = value, return value) while TS2345 occurs when passing a value as a function argument. Both are type mismatch errors — just at different sites.

TS2322 with null — how to fix?

Enable strictNullChecks in tsconfig (it's part of strict: true) and either handle null explicitly with ?? or !, or widen your type to number | null.

TS2322 on React props — how to fix?

The prop type in your component's interface doesn't match what you're passing. Check the component's Props interface and either fix the value you're passing or update the interface to accept it.

Can I use 'as' to fix TS2322?

Yes, but it bypasses type safety. Use 'as TargetType' only when you're certain the value is actually that type at runtime. Prefer fixing the root type mismatch instead.

TS2322 after enabling strict mode — why?

Strict mode enables strictNullChecks, which makes null and undefined separate types. Variables previously typed as number now reject null/undefined. Add | null or | undefined to the type or handle those values explicitly.

Convert JavaScript to TypeScript automatically

Paste your JS code and get type-annotated TypeScript — including fixes for common type errors — in seconds.

Try the converter →

Other TypeScript Errors

TS2345 TS2339 TS2304 TS2531 TS2532 TS2307 TS7006 TS2741 TS2554 TS2366 TS2349 TS2454 View all →

From the blog

View all →