Unable to resolve "zod/v4-mini" in react-native project

[ChristSei]

I use template of react-native project from https://github.com/infinitered/ignite.
I've modified the tsconfig such that the LSP can recognize import zod/v4-mini. However, building doesn't work

The same happens in anything that's not just "zod"

the following is the modified tsconfig.json
{ "compilerOptions": { "allowJs": false, "allowSyntheticDefaultImports": true, "experimentalDecorators": true, "jsx": "react-native", "module": "NodeNext", "moduleResolution": "NodeNext", "strict": true, "noImplicitAny": true, "noImplicitReturns": true, "noImplicitThis": true, "sourceMap": true, "target": "es2020", "lib": [ "esnext", "dom" ], "skipLibCheck": true, "resolveJsonModule": true, "baseUrl": ".", "paths": { "@/*": ["./app/*"], "assets/*": ["./assets/*"] }, "typeRoots": [ "./node_modules/@types", "./types" ], }, "extends": "expo/tsconfig.base", "ts-node": { "compilerOptions": { "module": "NodeNext" } }, "include": [ "**/*.ts", "**/*.tsx" ], "exclude": [ "node_modules", "test/**/*" ] }

[samchungy]

Hey @ChristSei things that would help in bug reports are:

1. What errors are you seeing.
2. Can you provide a reproduction.

[ChristSei]

The errors I'm seeing in my current project is:

Unable to resolve "zod/v4" from "app\services\Auth\auth.validation.ts"
ERROR [Error: undefined Unable to resolve module zod/v4 from D:\programming\experiment\TestIgniteNoDemo\app\services\Auth\auth.validation.ts: zod/v4 could not be found within the project
or in these directories:
node_modules

1 | import { z } from "zod/v4";
| ^
2 |
3 | export const loginSchema = z.object({
4 | username: z.string().min(1, "Username is required"),]

Reproduction can be done with the following steps

create a new ignite project
npx ignite-cli@latest new PizzaApp

install zod
npm install zod

import it in one of the file, I did it in WelcomeScreens.tsx
`
import { z } from "zod/v4-mini"

const temp = z.object({
usenrame: z.string().check(
z.minLength(1, "Username is required"),
)
})
`

the error appears after running
npm run android

Unable to resolve "zod/v4-mini" from "app\screens\WelcomeScreen.tsx"

[colinhacks]

I can't replicate after following those instructions and pasting in your tsconfig.json: https://github.com/colinhacks/pizzapp

Try clearing dependencies, uninstalling/reinstalling Zod, restarting the TS server, checking if zod is in node_modules, make sure there aren't other tsconfig.jsons that might be overriding the one in root.

[ChristSei]

okay, I checked using the repo you sent, and it ran well. but that's because the zod wasn't being used, only imported.
( maybe it got removed from bundle so that's why there's no error? )
I made changes to it in the WelcomeScreen.tsx

`import { useSafeAreaInsetsStyle } from "../utils/useSafeAreaInsetsStyle"
import { useAppTheme } from "@/utils/useAppTheme"
import * as z from "zod/v4"

const schema = z.object({
test: z.string().min(1)
})

const welcomeLogo = require("../../assets/images/logo.png")
const welcomeFace = require("../../assets/images/welcome-face.png")

interface WelcomeScreenProps extends AppStackScreenProps<"Welcome"> {}

export const WelcomeScreen: FC = observer(function WelcomeScreen(_props) {
const validated = schema.safeParse({
test: ""
})

console.log(validated)
const { themed, theme } = useAppTheme()`

https://github.com/ChristSei/pizzap here's the link to the repo with the modified WelcomeScreens.tsx

made the schema and used it, and it immediately produced an error
Unable to resolve "zod/v4" from "app\screens\WelcomeScreen.tsx"

using just 'zod' is fine, but 'zod/v3', 'zod/v4', and any others that require '/' after zod aren't. for now I'll just use zod v3 I suppose

[abanobboles]

@colinhacks There is actually also this error in relation to React Native where we can't get any further!
#4148

Reproduction
npx create-expo-app@latest
bun add zod

import * as z from "zod/v4";

const schema = z.object({
  test: z.string().min(1),
});

Link for test repo:
https://github.com/abanobboles/zodExpoTest

[gdorsi]

@ChristSei Which version of RN are you using?

Older versions require unstable_enablePackageExports to be turned on to resolve correctly zod packages.

You can also import the entry by manually typing the path:

import { z } from "zod/dist/esm/v4/mini"

@colinhacks This problem could be solved by adding some "redirect" entries in the zod package root.

Made a PR here if you think it might be worth a shot.

[colinhacks]

A potential fix has landed in zod@beta, can people try & report back?

[ChristSei]

tried beta and the issue seems to still persists

@ChristSei Which version of RN are you using?

I'm using react-native 0.76.9

I tried to import via manually typing the path but it gives me error in LSP ( after I reset the tsconfig to default https://gist.github.com/ChristSei/f97ba745d99cb4448f6a3ebe3234338d )

Could not find a declaration file for module 'zod/dist/esm/v4/mini'. 'd:/programming/temp/ZodIssue/node_modules/zod/dist/esm/v4/mini/index.js' implicitly has an 'any' type.

then, I ignored it and tried to compile it and run for android ( pnpm android ) anyway, and got the following error:
Unable to resolve "zod/v4/core" from "node_modules\zod\dist\esm\v4\mini\external.js"

[gdorsi]

Ah, seems that some of the internal imports need some more re-exports.

Let me give it another try.

[gdorsi]

@ChristSei The bug should be fixed in the latest version of Zod.

You can now import zod v4 on React Native without issues even in the older versions.

import * as z from "zod/v4";

const schema = z.object({
  test: z.string().min(1),
});

[ChristSei]

sorry for the late reply, I'd like to say that this did indeed fixes whatever issue I had