Recently, I have been trying new next 13 app directory using styled-jsx as a styling option. Soon after that I came to a contant warning conserning styles:
Error: This module cannot be imported from a Server Component module. It should only be used from a Client Component
Yet according to styled-jsx docs, it should work on both client and server side. So, what am I missing?
My guess is that next 13 is by default renders on the server side, whereas styled-jsx in its nutshell supports only client; cause as soon as I set "use client" at the start of the file, the problem disappears.
I'm having exactly same problem and would def want this to render on the server rather than using use client
.
Putting styled-jsx away until this is somehow sorted.
EDIT: There is a description how to use styled-jsx here: https://beta.nextjs.org/docs/styling/css-in-js