JAVASCRIPT

framer motion nextjs

import { motion } from 'framer-motion';

//use key with router if you are trying to do page transitions
function App ({ Component, pageProps, router}) {
	return (
   		<motion.div key={router.router} initial="pageInitial" animate="pageAnimate" variants={{
       		pageInitial: {
				opacity:0
			},
      		pageAnimate: {
           		opacity:1 
            },
		}}>
        	<Component {...pageProps} />
		</motion.div>
    )	
}

export default App;

Importing framer motion in Next.js

import { motion } from 'framer-motion';