Nextjs and Framer Motion
Is anyone else having issues using the Framer Motion library with their Nextjs project (pages router) ?
I am trying to add scroll animations using framer motion's scroll-triggered animations e,g
<motion.div
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
/>
My pages router next.js app doesn't need getStaticPaths or getStaticProps functions, as it's not using any dynamic data. Everything is created at build as static pages. However when I add in framer motion divs I get
"getStaticPaths is not a function"
I have seen people recommending the use of 'use-client', but I'm pretty sure this solution is for next.js app router projects or React Server Components, and is not even something I can use on a pages router next.js project, let alone required to use.
Any help on figuring this out would be appreciated. Framer Motion scroll events will be lovely and easy to set up when this issue goes away!
I am trying to add scroll animations using framer motion's scroll-triggered animations e,g
<motion.div
initial={{ opacity: 0 }}
whileInView={{ opacity: 1 }}
/>
My pages router next.js app doesn't need getStaticPaths or getStaticProps functions, as it's not using any dynamic data. Everything is created at build as static pages. However when I add in framer motion divs I get
"getStaticPaths is not a function"
I have seen people recommending the use of 'use-client', but I'm pretty sure this solution is for next.js app router projects or React Server Components, and is not even something I can use on a pages router next.js project, let alone required to use.
Any help on figuring this out would be appreciated. Framer Motion scroll events will be lovely and easy to set up when this issue goes away!
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
