Next 13.5 "use client" doesn't work
Unanswered
Cape May Warbler posted this in #help-forum
Cape May WarblerOP
Given code:
Doesn't run on client side, but if I put
I'm using latest version of next, installed just now
"use client"
import { Game } from "@/lib/game"
import { useEffect } from "react";
export default function GameContainer() {
useEffect(() => {
console.log("rendering");
const game = new Game(document.querySelector("#game")!);
game.start();
}, [])
return (
<div id="game">
<div id="stats"></div>
<div id="pet"></div>
</div>
)
}Doesn't run on client side, but if I put
console.log outside of useEffect I get console log to the terminal as if it was run on server side. Component is correctly imported, I even tried importing it like so but it didn't work neither const GameContainer = dynamic(import("@/components/game-container"), {ssr: false});I'm using latest version of next, installed just now
11 Replies
"use client" can be confusing. It doesn't mean everything runs on the client. It just means the component needs interaction and hydration. It still will be server side rendered as much as possible.
imo the react team chose the wrong wording. It should be called something more like "use interactive" or something like that to reduce confusion.
imo the react team chose the wrong wording. It should be called something more like "use interactive" or something like that to reduce confusion.
Cape May WarblerOP
Okay but either @KINXZ way my
console.logs previously were running on client even outside useEffect, and now neither they run inside nor outside useEffect so I still have issueI just tried it on stackblitz without issues:
https://stackblitz.com/edit/stackblitz-starters-mff9w3?file=components%2Fgame-container.tsx
https://stackblitz.com/edit/stackblitz-starters-mff9w3?file=components%2Fgame-container.tsx
Cape May WarblerOP
You are using
next 13.5.1, using create-next-app installs 13.5.4ok
i will install 13.5.4 and try again
Cape May WarblerOP
Anyway. I will try to manually downgrade my next version, it might be the answer
works with 13.5.4 too
Cape May WarblerOP
That's strange. I haven't tried oldest trick in the book yet, will see if restarting my machines will help anyhow
you can try to just delete the .next directory
this should clear all caches