ZodResolver schema types Error

[azimari-toure-ikbal]

I have an error on my useForm() with zodResolver : Argument of type 'ZodObject<{ name: ZodString; imageUrl: ZodString; }, "strip", ZodTypeAny, { name: string; imageUrl: string; }, { name: string; imageUrl: string; }>' is not assignable to parameter of type 'ZodType<any, any, any>'. The types of 'refine(...)._def.typeName' are incompatible between these types.

I am using pnpm and I've seen people sayin that it's a problem with zod version in pnpm monorepo but I can't seem to find the fix. Can someone help me please ?

[emilianooferreyra]

Have you been able to solve it? or do you just use npm or yarn?

[Moshyfawn]

What versions of react-hook-form, typescript and @hookform/resolvers are you using?

Do you have a project example / codesandbox to try?

[azimari-toure-ikbal]

I had the following:
"typescript": "5.2.2",
"react-hook-form": "^7.45.4",
"@hookform/resolvers": "^3.3.0",

[azimari-toure-ikbal]

Well I was able to solve it. I just tried again and again to change zod version in all files and pnpm install until it worked...

[reanzi]

That's interesting because I have the same problem and it real annoys me; what versions did work eventually?

[azimari-toure-ikbal]

I used zod version 3.22.2 as shown in the screenshot above

[ltann]

LOL mood @azimari-toure-ikbal

[marcos-venicius]

I just changed from pnpm to npm and the problem disappears.

I could not be the best solution obviously, but, to my case, this was good enough

[azimari-toure-ikbal]

On another repo I did the same but I really want to use pnpm so I'll keep trying !

[manuelbosi]

I also don't want to switch from pnpm to npm.
I tried these steps and they should fix the error.

1. Delete node_modules folder in your project
2. Run pnpm store prune
3. Run pnpm install to reinstall dependencies

[azimari-toure-ikbal]

Alright so it is said that it is a know bug and to resolve it we cant just downgrade versions and go for zod 3.21.4

[samuelsogbesan]

In case anyone else runs into a similar problem with zod@v4 and react-hook-form - for me, the issue was using z.coerce().number() in my schemas, since this casts to unknown and then to number. The work around was to swap to z.transform(Number).pipe(z.number()):

Before

export const mySchema = z.object({
    price: z.coerce().z.number().min(1, "Please enter your price.")),
});

After

export const mySchema = z.object({
    price: z.transform(Number).pipe(z.number().min(1, "Please enter your price.")),
});

This issue should shed more light: colinhacks/zod#3769

[alimpam]

i have this problem too, if i use transform,coerce or preprocess then resolver thinks there are two types of same name with different type declarations

[mills-git]

@arthur-trafex @alimpam, how are you using the useForm hook? If your code looks like this, for example, when using coerce it will cause a TypeScript error:

const schema = z.object({
    price: z.coerce.number()
});

const form = useForm<z.infer<typeof schema>>({
    resolver: zodResolver(schema),
});

Instead, when using useForm, you need to properly specify both TFieldValues and TTransformedValues with the correct types, the reason that the above does not work is because the types generated by Zod when using z.input and z.infer / z.output are different. Note that a lot of the time they will be the same and so usually no error shows. An example without error is this:

const schema = z.object({
    price: z.coerce.number()
});

type SchemaInput = z.input<typeof schema>;

// Note that the below are both the same
type SchemaInferred = z.infer<typeof schema>;
type SchemaOutput = z.output<typeof schema>;

const form = useForm<SchemaInput, unknown, SchemaOutput>({
    resolver: zodResolver(schema),
});

[ltann]

@mills-git this is the exact way my schema is being written. Can i see any docs and source that mentions this? thanks

[ltann]

the above solution works from @samuelsogbesan tysm