Skip to content
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, 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. #753

Closed
vikasg603 opened this issue Dec 21, 2022 · 3 comments
Labels

Comments

@vikasg603
Copy link

Version

Latest ^6.0.0

Steps to reproduce

Using the library on NextJS

Expected Behavior

There should be no use of useLayoutEffect

Actual Behavior

Library is using useLayoutEffect

@vikasg603 vikasg603 added the bug label Dec 21, 2022
@ericgio
Copy link
Owner

ericgio commented Dec 22, 2022

Hey @vikasg603, thanks for opening this issue. I'll take a look; it may be we don't need to use useLayoutEffect here. That said, the use of useLayoutEffect in general is totally valid. If you're using SSR and running into this warning with client-side components, then you should delay rendering until you're in a client-side environment.

@ericgio ericgio closed this as completed Dec 22, 2022
@vikasg603
Copy link
Author

@ericgio but may i know the reason of closing the issue?
I don’t think it is solved till now.

@ericgio
Copy link
Owner

ericgio commented Dec 22, 2022

@vikasg603: as I mentioned above, there's nothing inherently wrong about using useLayoutEffect in this library. The warning is related to your integration of the library in your codebase, which is something I can't control.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

2 participants