Next.js에서 Framer motion Error 오류 해결 방법: 'use client'로 간단히 해결!
KUKJIN LEE • 6개월 전 작성
Framer motion Error: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function
이 오류는 Next.js 14 버전에서 발생할 수 있으며, 간단한 해결 방법이 있습니다.
오류 원인
Next.js 14 버전에서는 클라이언트 컴포넌트를 명시적으로 선언해야 합니다.
문제를 해결하기 위해서는 Framer Motion을 사용하는 파일의 최상단에 'use client'
를 추가하면 됩니다.
예시 코드)
"use client";
import React from "react";
import { motion } from "framer-motion";
// Your component code
const MyComponent = () => (
<motion.div
initial={{ opacity: 0 }}
animate={{ opacity: 1 }}
exit={{ opacity: 0 }}
>
Hello, Framer Motion!
</motion.div>
);
export default MyComponent;
요약
-
오류:
Error: (0 , react__WEBPACK_IMPORTED_MODULE_0__.createContext) is not a function
-
원인: React의
createContext
함수가 호출되지 않음 -
해결 방법: Framer Motion을 사용하는 파일에
"use client"
추가