Cover image

Zod Error

About

Copy heading link

Zod Error converts and formats zod Issues into a customizable error message string that can be consumed by various applications such as front-end error message modals or API error messages.

Error messages are completely customizable from label names to delimiters, prefixes, suffixes and the inclusion/exclusion of components (code, path, message). An options argument can be passed to any Zod Error function as the last argument to customize the error message.

Zod Error converts an array of Zod Issues that look like this:

TypeScript

into this:

Plain text

Open source

Copy heading link

The project is Open Source and can be viewed on GitHub & NPM.

Features

Copy heading link
  • Options to customize the code component of the error message.
  • Options to customize the message component of the error message.
  • Options to customize the code path of the error message.
  • Set the delimiter between error messages and between components.
  • Set the maximum amount of error messages to display in the final concatenated string.
  • Add a prefix to the start of the final concatenated message.
  • Add a suffix to the end of the final concatenated string.
  • Custom function to transform the format of each error message.

Technologies used

Copy heading link

Examples

Copy heading link

There are 6 ways to consume Zod Error. generateErrorMessage(), generateError(), parse(), parseAsync(), safeParse() and safeParseAsync().

generateErrorMessage(issues: z.ZodIssue[], options?: ErrorMessageOptions): string

Copy heading link

Formats an array of Zod Issues as a result of z.parse(), z.parseAsync(), z.safeParse() or z.safeParseAsync() and outputs as a single string. Multiple errors are concatenated into a single readable string.

TypeScript

Output:

Plain text

generateError(issues: z.ZodIssue[], options?: ErrorMessageOptions): Error

Copy heading link

Formats an array of Zod Issues as a result of z.parse(), z.parseAsync(), z.safeParse() or z.safeParseAsync() and outputs as a JavaScript Error object. Multiple errors are concatenated into a single readable string.

TypeScript

Output:

Plain text

parse<T>(schema: z.ZodSchema<T>, data: unknown, options?: ErrorMessageOptions): T

Copy heading link

Replaces Zod's .parse() function by replacing Zod's ZodError with a generic JavaScript Error object where the custom-formatted message can be accessed on error.message.

TypeScript

Output:

Plain text

Note:

If your schema contains an async .refine() or .transform() function, use parseAsync() instead.

safeParse<T>(schema: z.ZodSchema<T>, data: unknown, options?: ErrorMessageOptions): SafeParseReturnType<T>

Copy heading link

Replaces Zod's .safeParse() function by replacing Zod's SafeParseReturnType with a similar return type where if result.success is false, the custom formatted error message will be available on result.error.message.

TypeScript

Output:

Plain text

Note:

If your schema contains an async .refine() or .transform() function, use safeParseAsync() instead.