resolvers: Imports not works since version 2.8.4 or 2.8.3

Describe the bug Hi, i have a NextJS application implemented with typescript that uses the yupResolver from this library. I have several deployments on Vercel and Heroku platforms that does not find the module.

Also, i have never imported successfuly using import { yupResolver } from '@hookform/resolvers/yup'; statement, by the way, for production deployments i have always used import { yupResolver } from '@hookform/resolvers/yup/dist/yup';.

Rollback and freezing the version for 2.8.3 has worked sucessfully, but as i can see, import the resolvers has always been shown to have issues.

I can not reproduce in a sandbox now, as it involves some proprietary code, but was kind hard to discover in my application that the issue involved the yupResolver by showing the following error

<html>
<body>
<!--StartFragment-->

Error occurred prerendering page "/cms/campaigns/new". Read more: https://nextjs.org/docs/messages/prerender-error
--
10:28:55.260 | ReferenceError: Cannot access '__WEBPACK_DEFAULT_EXPORT__' before initialization
10:28:55.260 | at Object.Z (/vercel/path0/.next/server/chunks/3705.js:3505:36)
10:28:55.260 | at NewCampaignProfile (/vercel/path0/.next/server/pages/cms/campaigns/new.js:37:165)
10:28:55.260 | at d (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:33:498)
10:28:55.261 | at bb (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:16)
10:28:55.261 | at a.b.render (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:42:43)
10:28:55.261 | at a.b.read (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:41:83)
10:28:55.261 | at Object.exports.renderToString (/vercel/path0/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:52:138)
10:28:55.261 | at renderPage (/vercel/path0/node_modules/next/dist/server/render.js:723:46)
10:28:55.261 | at Object.ctx.renderPage (/vercel/path0/.next/server/pages/_document.js:71:30)
10:28:55.261 | at Object.defaultGetInitialProps (/vercel/path0/node_modules/next/dist/server/render.js:364:51)

<!--EndFragment-->
</body>
</html>

This similar error has been reproduced across many other modules, as those NextJS page has a built in a implementation of react hook form in a footer component. After that, i have been isolating a lot of code until get a error that crashed in production execution.

Some errors have mention that resolvers implementation were not available to be used with CommonJS implementation, so i recommend to check if those resolvers exports are correctly to be used by typescript code.

About this issue

Original URL
State: closed
Created 2 years ago
Comments: 15 (7 by maintainers)

Most upvoted comments

I was able to build successfully on the latest version of Next (12.0.9 when I tried last week) and latest version of @hookform/resolvers. I suspect deeper issues are at play in this particular case.

evocateur on Feb 8, 2022

related issue: #271

That’s really similar. I have tried to put "preserveSymlinks": false in tsconfig.json without success. I think is some NextJS 12 module resolution mismatch. For now, i’m freezing this library at 2.8.3 version and importing @hookform/resolvers/yup/dist/yup

yangricardo on Jan 26, 2022

"preserveSymlinks": true in the tsconfig is a potential red flag, although I’m not 100% confident.

import { yupResolver } from '@hookform/resolvers/yup' with @hookform/resolvers@2.8.5 and next@12.0.7 definitely works, can’t speak to later versions or canary releases. Is there any custom config in next.config.js that could be changing the default ESM resolution behavior?

evocateur on Jan 25, 2022