react-hook-form webpack error & tailwind doesn't compile from external ui package - HELP
- Dominant language
- TypeScript
- Stars
- 11.3k
- Forks
- 275
- PR merge metrics
- No merged PRs in 30d
Description
I am posting this on the relevant repositories as I do not know what to do.
I have a project with NextJS that I've started to work on which has a `ui` package with `tsup` and that contains tailwind based components via shadcn and one of the components is form using `react-hook-form`.
## Problem 1 - `react-hook-form`
When I use the form component, I get this error, even though I have configured tsup to do "use client"; and also in the component itself I am using "use client";
```TypeError: Cannot destructure property 'getFieldState' of '(0 , react_hook_form__WEBPACK_IMPORTED_MODULE_5__.useFormContext)(...)' as it is null.```
## Problem 2 - tailwind compiler not working
This might be my configuration error, but I've replicated the configuration from a monorepo with the [same setup as me](https://github.com/juliusmarminge/acme-corp/tree/main) in the NextJS tailwind compiler content to go `"../../packages/ui/src/**/*.{ts,tsx}"`.
The way I am testing it is with a button component from the UI package being rendered on the page:
You can see that there is no styling on the button.
Any help would be appreciated, or at least some steps to the right direction. [Here is my project](https://github.com/DavidIlie/laundrey)
Thank you!
Contributor guide
Research direction
Start by reproducing both failures from the linked laundrey project, then inspect the tsup configuration, the UI package's form component, and the NextJS Tailwind content configuration. Separate the react-hook-form context error from the missing Tailwind styles; done means both the form renders without the reported error and the external UI button receives its styles.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- nextjs, react, tailwindcss, typescript
- Domain
- build-system, frontend, tooling
- Issue type
- Bug
- Difficulty
- 4/5
- Estimated time
- 3-5 days
- Activity status
- Stale
- Clarity
- Needs clarification
- Newbie friendliness
- 25/100