Property is missing in type 'X' but required in type 'Y'

avatar

Borislav Hadzhiev

Last updated: Mar 22, 2022

banner

Photo from Unsplash

Property is missing in type 'X' but required in type 'Y' #

The TypeScript error "Property is missing in type but required in type" occurs when we do not set all of the properties an object of the specified type requires. To solve the error, make sure to set all of the required properties on the object or mark the properties as optional.

property missing in type but required in type

Here are some examples of how the error occurs.

index.ts
type Person = { name: string; country: string; }; // ⛔️ Property 'country' is missing in type // '{ name: string; }' but required in type 'Person'.ts(2741) const person: Person = { name: 'Tom', }; // ------------------------------------------------------ function getPerson(person: Person) { return person; } // ⛔️ Property 'country' is missing in type // '{ name: string; }' but required in type 'Person'.ts(2345) getPerson({ name: 'Tom' }); // ------------------------------------------------------ const people: Person[] = []; // ⛔ Property 'country' is missing in type // '{ name: string; }' but required in type 'Person'.ts(2345) people.push({ name: 'Alice' }); // ------------------------------------------------------ interface Employee { id: number; name: string; } // ⛔️ Property 'name' is missing in type // 'Developer' but required in type 'Employee'.ts(2420) class Developer implements Employee { id = 1; }

In the first example, we declared the person variable and only set its name property, but the Person type also requires a country property.

One way to solve the error is to provide a value for the country property.

index.ts
type Person = { name: string; country: string; }; const person: Person = { name: 'Tom', country: 'Germany', };

The person variable now correctly satisfies the Person type, so the error is resolved.

Another way to solve get around this is to mark the properties that we don't want to set on the object as optional in the Person type.

index.ts
type Person = { name: string; country?: string; // 👈️ mark optional }; const person: Person = { name: 'Tom', };

We used a question mark to set the country property in the Person type to optional.

This means that it can either be of type string or have an undefined value.

The error message usually states which property is missing, so one way to debug is to look at the type of the variable and see if contains the specified property.

If you are calling a function that has an object parameter, make sure to set all of the properties the object type requires.

index.ts
type Person = { name: string; country: string; }; function getPerson(person: Person) { return person; } // ⛔️ Property 'country' is missing in type // '{ name: string; }' but required in type 'Person'.ts(2345) getPerson({ name: 'Tom' });

The country property is missing in the call to the getPerson function.

To solve the error, we have to either add the country property to the object or mark it as optional on the type alias.

index.ts
type Person = { name: string; country: string; }; function getPerson({ name, country = '' }: Person) { return { name, country }; } getPerson({ name: 'Tom', country: 'Germany' });

If you have a class that implements an interface, make sure to define all properties and methods the interface requires.

index.ts
interface Employee { id: number; name: string; } // ⛔️ Property 'name' is missing in type // 'Developer' but required in type 'Employee'.ts(2420) class Developer implements Employee { id = 1; }

The Developer class implements the Employee interface, so it has to define the required name property.

index.ts
interface Employee { id: number; name: string; } class Developer implements Employee { constructor(public id: number, public name: string) { this.id = id; this.name = name; } }
The error "Property is missing in type but required in type" sometimes occurs if we define a type or interface using a name that clashes with a globally defined interface, or one from a third-party module.

If you notice a strange error message with property and method names you don't recognize, try renaming your interface or type alias.

Conclusion #

The TypeScript error "Property is missing in type but required in type" occurs when we do not set all of the properties an object of the specified type requires. To solve the error, make sure to set all of the required properties on the object or mark the properties as optional.

I wrote a book in which I share everything I know about how to become a better, more efficient programmer.
book cover
You can use the search field on my Home Page to filter through all of my articles.