1Install Framer Motion # If you're using npm npm install framer-motion # If you're using yarn yarn add framer-motion 2Reduce bundle size by using LazyMotion index.jsimport { AnimatePresence, domAnimation, LazyMotion, m } from 'framer-motion' 3Use AnimatePresence with LazyMotion index.jsimport { AnimatePresence, domAnimation, LazyMotion, m } from 'framer-motion' const Home = () => { return ( <LazyMotion features={domAnimation}> <Container> <AnimatePresence> {/_ Animated Left Pane _/} <m.div key="left-pane" initial={{ x: -500 }} animate={{ x: 0 }} exit={{ x: -500 }} className="max-h-100 hidden h-full w-1/4 justify-center rounded-3xl bg-gray-800 lg:flex" > // Custom component </m.div> </AnimatePresence> </Container> </LazyMotion> ) } export default HomeSharing is Caring