Motion / Troubleshooting14 ERR · 05 WARN
Troubleshooting
Errors and warnings happen. Solve them with Motion's straightforward troubleshooting log.
FILTER:///19 / 19
- 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
- WARNColor not animatable'${color}' is not an animatable color. Use the equivalent color code instead.
- WARNComplex values are too differentComplex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.
- WARNReduced Motion enabledYou have Reduced Motion enabled on your device. Animations may not appear as expected.
- WARNSpring duration limitSpring duration must be 10 seconds or less
- WARNValue not animatableYou are trying to animate ${name} from "${originKeyframe}" to "${targetKeyframe}". "${invalidKeyframe}" is not an animatable value.