Motion / Troubleshooting14 ERR · 05 WARN

Troubleshooting

Errors and warnings happen. Solve them with Motion's straightforward troubleshooting log.

Filter troubleshooting entries19 / 19

>Errors14

ERRdragConstraints ref not hydratedIf `dragConstraints` is set as a React ref, that ref must be passed to another component's `ref` prop.
ERRIncorrect cubic bezier lengthCubic bezier arrays must contain four numerical values.
ERRInvalid easing typeInvalid easing type '${definition}'
ERRLazy strict modeYou have rendered a `motion` component within a `LazyMotion` component. This will break tree shaking. Import and render a `m` component instead.
ERRMax CSS variable depthMax CSS variable fallback depth detected in property "${current}". This may indicate a circular fallback dependency.
ERRMini animate() doesn't support type: "spring"Mini animate() doesn't support "type" as a string.
ERRNo valid elementsNo valid elements provided.
ERRPerform animation on nullYou're trying to perform an animation on null. Ensure that selectors are correctly finding elements and refs are correctly hydrated.
ERRRange length mismatchBoth input and output ranges must be the same length.
ERRReorder.Group must be provided valuesReorder.Group must be provided a values prop
ERRReorder.Item must be child of Reorder.GroupReorder.Item must be a child of Reorder.Group
ERRRepeat count too highRepeat count too high, must be less than 20.
ERRSpring only supports two keyframesOnly two keyframes currently supported with spring and inertia animations. Trying to animate ${keyframes}.
ERRuseScroll ref is not hydratedContainer/Target ref is defined but not hydrated

>Warnings05

>Developer tools

Never see this page again.

Motion's range of developer tools lets you animate it right the first time, every time.

>CSS Studio
Visual edits in real-time.
A visual editor for your site, using your existing AI agent. Tweak animations, styles and content in real-time. Your agent writes the changes back to your code.
Try CSS Studio
>Motion AI Kit
Ahead of the curve.
Generate CSS spring linear() curves on demand, directly from your agent. No more hand-tuning, or round-trips to external sites.
Get the AI Kit
>MotionScore
Catch issues before they ship.
Audit any site's animation performance. Reports grade animations S to F with copy-paste fixes for your agent. Block performance regressions via CI.
Run free audit
>Motion+
Premium components, ready to drop in.
Carousel, Ticker, Cursor, AnimateNumber, splitText, 370+ examples showcasing best practises. One-time fee, lifetime access.
Explore Motion+