Get this issue when running npm run dev:
○ Compiling / ...
⨯ ./components/Hero.js
Error:
× You're importing a component that needs useEffect. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default.
│ Learn more: https://nextjs.org/docs/getting-started/react-essentials
│
│
╭─[/Users/itsmohmusa/Projects/outpost-clone/components/Hero.js:1:1]
1 │ // components/Hero.js
2 │ import { useEffect } from "react";
· ─────────
3 │ import { gsap } from "gsap";
4 │
5 │ const Hero = () => {
╰────
Import trace for requested module:
./components/Hero.js
./app/page.tsx
Get this issue when running npm run dev: ○ Compiling / ... ⨯ ./components/Hero.js Error: × You're importing a component that needs useEffect. It only works in a Client Component but none of its parents are marked with "use client", so they're Server Components by default. │ Learn more: https://nextjs.org/docs/getting-started/react-essentials │ │ ╭─[/Users/itsmohmusa/Projects/outpost-clone/components/Hero.js:1:1] 1 │ // components/Hero.js 2 │ import { useEffect } from "react"; · ───────── 3 │ import { gsap } from "gsap"; 4 │ 5 │ const Hero = () => { ╰────
Import trace for requested module: ./components/Hero.js ./app/page.tsx