How To Solve “An index signature parameter type cannot be a literal type or a generic type” in TypeScript

While working, when we use a data type that does not make it suitable for the index signature, then an error appears “An index signature parameter type cannot be a literal type or a generic type“. This article will show you how to fix it by using Mapped Types or Record Utility Type. Let’s get started

The cause of the error “An index signature parameter type cannot be a literal type or a generic type”

The error occurs when we use a data type that does not make it suitable for the index signature. There are two cases that is using union type or using enum type. Let’s go through an example of the error of each case

Error Example:

enum DaysOfWeek {
    Mondays,
    Tuesdays,
    Wednesdays,
    Thursdays,
    Fridays,
    Saturdays,
    Sundays,
}

type Day = {
    // An error occurred because the Index Signatures are not accepting the data type as a enum
    [day: DaysOfWeek]: string;
};

Error Output:

An index signature parameter type cannot be a literal type or generic type.

In the above example, we declare an enum type as the days of the week. Then we declare a data type as Day whose Index Signatures is the enum we just declared above. This is not true for Index Signatures. Usually, we just use string or number for Index Signatures, and so an error occurs.

Error Example:

type Condition = "BrandNew" | "Used" | "LikeNew";

type ConditionOfItem = {
    // An error occurred because the Index Signatures are not accepting the data type as a union
    [item: Condition]: string;
};

Error Output:

An index signature parameter type cannot be a literal type or generic type.

In the second example mentioned above, we declare a union type for the condition of the goods. Then we use this union type for the Index Signatures of another data type. An error occurred because the Index Signatures are not accepting the data type as a union.

Solution to fix this error

To solve this error, we will use Mapped Types, which is a syntax built specifically for Index Signatures. Using Mapped Types to declare previously undeclared data types for Index Signatures, we can also use the Record utility type, which works the same way as Mapped Types.

Using Mapped Types

In order for Index Signatures to work with enums and unions, we will use the ‘in’ keyword in the declaration.

Example:

enum DaysOfWeek {
    Mondays,
    Tuesdays,
    Wednesdays,
    Thursdays,
    Fridays,
    Saturdays,
    Sundays,
}
type Day = {
    // Use Mapped Types to work with enums and unions
    [day in DaysOfWeek]: string;
};

Using Record Utility Type

This utility type builds an object based on the Type and can also be used to map a property of one type to another.

Example:

type Condition = "BrandNew" | "Used" | "LikeNew";

// Use Record Utility Type for constructs an object
type ConditionOfItem = Record<Condition, string>;

Summary

Through the article, we have fixed the error “An index signature parameter type cannot be a literal type or a generic type” by using Mapped Types and Record Utility Types. Usually, in this situation, we prefer to use the Mapped Types to solve. Hope the article is helpful to you. Thanks for reading.

Leave a Reply

Your email address will not be published. Required fields are marked *