Example using next with <CacheProvider/> in pages/_app.tsx.

[ziggy6792]

Hi

Thanks a lot for this tool and your examples and docs.

I am trying to use tss-react with next

I read your docs here https://docs.tss-react.dev/ssr/next.js and checked-out the example here https://github.com/garronej/tss-react/tree/main/src/test/apps/ssr

When I move the cache provider to _app.tsx the styles no longer work when server side rendering (I get an initial un-styled page from the server which is then styled on the client)

Here is a my code.

https://github.com/ziggy6792/tss-react/tree/provider-in-app

Thanks a lot

[garronej]

Hi @ziggy6792,
Thank you for coming up with a sample project to show me the issue you are experiencing, if everyone could do like this it would save me a lot of time 👍🏻 .
The problem is that you import createMuiCache in _document.tsx from index.tsx instead of _app.tsx.
See here.

Nevertheless it's a good idea to put the providers in _app.tsx. I updated the example SSR app.

[ziggy6792]

Hi @garronej

Oops my mistake.
Thanks so much and thanks again for a great tool.
I much prefer using this compared to the new emotion styled api