stitchesjs / stitches

[Not Actively Maintained] CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.

Home Page:https://stitches.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

not working from next.js 13 & need server side supports for next.js 13

restareaByWeezy opened this issue · comments

Bug report

I tried on next.js 13 app dir and it seems styling is not working.

I read the issue below and found couple of answers to figure it out
example:

"use client"

import React from "react"
import { useServerInsertedHTML } from "next/navigation"
import { getCssText } from "../../stitches.config"

export function ServerStylesheet({ children }) {
  useServerInsertedHTML(() => {
    return <style id="stitches" dangerouslySetInnerHTML={{ __html: getCssText() }} />
  })

  return children
}

#1109

but still not working for me (even from client side).
Any solutions suggested?

I successfully done with setting stitches with next13. Use hook useServerInsertedHTML

@Nedilko Do you have some example code - I can only get client-side style rendering to work.

I think this is a duplicate of #1109.

I created client a wrapper, where I simply use hook useServerInsertedHTML. Inside this hook I return style tag.

@Nedilko, could you put the code snippet here?
I didn't find the solution
Thank you