Drizzle Team•14mo ago

How to use drizzle-zod generated schemas in Next.JS frontend?

I'm currently using the pages dir in Next.JS and I have a function making an API call. I want to pass the returned body into the generated zod schema using zod and drizzle-zod. The problem is, when I import any created schema, I receive this error:

 ⨯ ../../node_modules/.pnpm/[email protected]/node_modules/postgres/cjs/src/connection.js:1:0
Module not found: Can't resolve 'net'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
../../node_modules/.pnpm/[email protected]/node_modules/postgres/cjs/src/index.js
../../packages/db/dist/db/client.js
../../packages/db/dist/index.js
./src/pages/manage/classes/index.tsx

 ⨯ ../../node_modules/.pnpm/[email protected]/node_modules/postgres/cjs/src/connection.js:1:0
Module not found: Can't resolve 'net'

https://nextjs.org/docs/messages/module-not-found

Import trace for requested module:
../../node_modules/.pnpm/[email protected]/node_modules/postgres/cjs/src/index.js
../../packages/db/dist/db/client.js
../../packages/db/dist/index.js
./src/pages/manage/classes/index.tsx

This leads me to believe that I can't use my zod schemas because they depend on the drizzle table created with pgTable, which relies on net. Is there a way around this?

2 Replies

THE MASTER•12mo ago

did u find the answer to this @nico ?

nicoOP•12mo ago

My solution was to edit next.config.js with this:

            webpack: (config, { isServer }) => {
                if (!isServer) {
                    config.resolve.alias["net"] = false;
                    config.resolve.alias["tls"] = false;
                    config.resolve.alias["fs"] = false;
                }
                return config;
            },

            webpack: (config, { isServer }) => {
                if (!isServer) {
                    config.resolve.alias["net"] = false;
                    config.resolve.alias["tls"] = false;
                    config.resolve.alias["fs"] = false;
                }
                return config;
            },

Gaming

Programming

How to use drizzle-zod generated schemas in Next.JS frontend?