Add turbopack support on NextJS App

[fernandortec]

Description

Add support for running Next app with the flag --turbo, using Turbopack's Rust compiler for a performance boost.

Problem Statement/Justification

When running Panda with Nextjs, it works with SSR out of the box without any config (pretty cool btw), but when trying to run next dev --turbo the styling also works, but if you make any changes it won't reflect on your app with hot-reload, you need to manually re-start the server.

I'm aware that a feature like that would be pretty complex to implement and would most likely need to work closely with the Vercel team to find out why the heck it didn't work, I just wanted to document it.

Proposed Solution or API

https://turbo.build/pack/docs

I've read this documentation about it, but it doesn't seem to provide many detail on how exactly it bundles the code, or what changed from migrating to rust, so I'm not sure what the solution might-be

Alternatives

No response

Additional Information

No response

[astahmer]

I might be wrong but I don't think we need to do anything on our side, as we are not providing a specific integration with any bundler (not vite, not webpack, not nextjs with webpack or turbopack), we're merely offering a way to use Panda CSS through PostCSS, which is supposed to be supported by any modern bundler

an alternative for you if turbopack doesnt yet support (or without issues) PostCSS HMR, is to try swapping to the Panda CSS CLI which is entirely uncorrelated to bundlers and instead provides a way to generate a CSS file that you can import as if it was one that you had written yourself

[fernandortec]

Ah okay, yeah I wasn't quite sure, which side could be changed so it works, Panda or Next, thanks for the reply, I'll try it on a turborepo (instead of turbopack) to see if it'll work there.

[gurkerl83]

@fernandortec In my last project, we enabled Turbopack, and it worked most of the time. I recall that HMR occasionally got stuck, but this issue might be resolved in the latest Next.js version.