-
-
Notifications
You must be signed in to change notification settings - Fork 180
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Warning: useLayoutEffect does nothing on the server [...] #367
Comments
@emilkowalski Please can this be merged? |
Webpack with [email protected] gives the same warning during development. It would be appreciated if either a fix or ignore for it would be merged. |
hi @emilkowalski, can you see this one please |
@emilkowalski We need this |
@emilkowalski pls |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Issue
I use Vaul inside a Remix app with vite and [email protected]. During development, Vite raises the following warning:
Warning: useLayoutEffect does nothing on the server, because its effect cannot be encoded into the server renderer's output format. This will lead to a mismatch between the initial, non-hydrated UI and the intended UI. To avoid this, useLayoutEffect should only be used in components that render exclusively on the client. See https://reactjs.org/link/uselayouteffect-ssr for common fixes.
Potential solution
This error is common with
useLayoutEffect
and the work-around is usually to create auseIsomorphicLayoutEffect
hook, which you did in "vaul/src/use-prevent-scroll.ts":However,
React.useLayoutEffect
is still referenced in "vaul/src/index.tsx" at line 456:I believe switching to
useIsomorphicLayoutEffect
would solve the issue ? Or maybe I am missing something and the warning should be ignored ?The text was updated successfully, but these errors were encountered: