question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

motion.custom() is deprecated. Use motion() instead

See original GitHub issue

🐛 Bug report

Provide a brief description of the bug here

This warning: motion.custom() is deprecated. Use motion() instead gets logged to the console whenever a new chakra-ui project is created with framer-motion@3.7.0. Framer motion changelog.

💥 Steps to reproduce

Clear and concise reproduction steps are important for us to be able to triage your issue in a timely manner

  1. Go to ‘…’
  2. Click on ‘…’
  3. Scroll down to ‘…’
  4. See error

💻 Link to reproduction

Please create a minimal reproduction in CodeSandbox

https://codesandbox.io/s/delicate-glitter-hroux

🧐 Expected behavior

Tell us what you expect to happen.

🧭 Possible Solution

Not compulsory, but suggesting a fix would be great!

🌍 System information

Software Version(s)
Chakra UI
Browser
Operating System

📝 Additional information

  • Screenshots or code
  • Notes or link to ideas

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Reactions:37
  • Comments:13 (4 by maintainers)

github_iconTop GitHub Comments

11reactions
callum-mellorreed-privitarcommented, Mar 8, 2021

If you’re affected by this and use Yarn, for now you can add a resolution for the relevant dependency to your package.json.

"resolutions": {
  "framer-motion": "3.6.7"
}

This will tell Yarn to use framer-motion@3.6.7 even if a newer version matches the range specified by the depending package. This is the latest version before motion.custom() deprecation.

4reactions
smbleecommented, Mar 1, 2021

This breaks the chakra-cli tokens command for me.

chakra-cli tokens src/styles/theme/theme.ts

image

Read more comments on GitHub >

github_iconTop Results From Across the Web

Next.js "_framerMotion.motion.custom is not a function"
custom() due to outdated documentation, do not downgrade to 3.10.6. Find out what the proper syntax for v4 is instead. motion.custom() has been ......
Read more >
Upgrade guides | Framer for Developers
Framer Motion uses pointer events to detect tap, drag and hover gestures. ... 4 also removes motion.custom() , which was previously deprecated in...
Read more >
Chakra UI + Framer Motion
This example shows how to add some interesting motion interaction or animation to your Chakra UI websites or apps with Framer Motion. Usage#....
Read more >
Next.js "_framerMotion.motion.custom is not a function"-Reactjs
custom() due to outdated documentation, do not downgrade to 3.10.6. Find out what the proper syntax for v4 is instead. motion.custom() has been...
Read more >
Everything about Framer Motion layout animations
We can't animate a motion component between layouts using a combination of initial and animate props as we would do for other kinds...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found