search

motiondivision / motion

A modern animation library for React and JavaScript
https://motion.dev
MIT License
25.92k stars 851 forks source link

[BUG] Module not found: Can't resolve 'framer-motion' #2642

Open KaterinaKachann opened 7 months ago

KaterinaKachann commented 7 months ago

1. Read the FAQs 👇

2. Describe the bug

When I installed framer motion and start use in next js v14/react v18, I got error in console - Module not found: Can't resolve 'framer-motion'

3. IMPORTANT: Provide a CodeSandbox reproduction of the bug

A CodeSandbox minimal reproduction will allow us to quickly follow the reproduction steps. Without one, this bug report won't be accepted.

4. Steps to reproduce

Steps to reproduce the behavior:

Screen Shot 2024-04-29 at 13 05 43 Screen Shot 2024-04-29 at 13 06 40
ryparker commented 2 months ago

Looks like they broke the client side rendering. workaround is to create a file for each used motion component.

For example to use motion.li create:

MotionLi.tsx

'use client';

import { motion } from 'framer-motion';

export const MotionLi = motion.li;