Skip to content

[bug]: UseSpring() Not firing in NextJS 14 #2361

@hq-aw

Description

@hq-aw

Which react-spring target are you using?

  • @react-spring/web
    @react-spring/three
    @react-spring/native
    @react-spring/konva
    @react-spring/zdog

What version of react-spring are you using?

9.7.5

What's Wrong?

UseSpring() is not firing in NextJS 14 dev environment.

Using the first example from the docs:
https://codesandbox.io/p/devbox/bold-andras-ymxghg

To Reproduce

Use the NextJS 14 Starter, create a simple component with useSpring, run npm run dev

Expected Behaviour

The element should animate.

Link to repo

https://codesandbox.io/p/devbox/bold-andras-ymxghg

Activity

hq-aw

hq-aw commented on Mar 12, 2025

@hq-aw
Author

Apparently also the case in NextJS 13 #2146

Stan-Stani

Stan-Stani commented on Mar 14, 2025

@Stan-Stani

In Next 14 I was seeing a looped animation not start unless it was rerendered. I used a useEffect to toggle the pause spring prop once hydration (mounting) was complete and that made the animation start correctly even after page hard reload.

ETA: Ha, now it doesn't loop when I do a client side navigation back to the page though.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

      Development

      No branches or pull requests

        Participants

        @Stan-Stani@hq-aw

        Issue actions

          [bug]: UseSpring() Not firing in NextJS 14 · Issue #2361 · pmndrs/react-spring