Tree shaking issue with Nuxt UI (Reka)
Hi. I'm currently building an app with nuxt ui for components, and I'm experiencing this issue:
https://github.com/nuxt/ui/issues/3376
Development is still in it's early stage (app will grow exponentially) and DX is already unbearable.
I've tried basically every suggestion in the conversation, nothing works. It seems the only solution is to wait for for vite to be on rolldown.
Does anyone have an idea of a possible alternative solution? Or at least what I could do to improve DX
Development is already paused
GitHub
How can I tree-shake reka-ui? · Issue #3376 · nuxt/ui
Description I am using the Nuxt UI playground template from here. After running pnpm build, I noticed that .output/server/node_modules/reka-ui/dist contains many unused components. How can I config...
2 Replies
Hi @ɬɧҽƈαʋყɖҽʋ. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
I'm sorry to hear about your experience with tree-shaking issues in Nuxt UI (Reka). Based on the knowledge sources provided, here’s what is currently known and what you might consider:
Current State & Rolldown-Vite
You are correct that the Nuxt team is actively working on improving build performance and tree-shaking, especially with the upcoming support for Rolldown-Vite. There are several PRs and discussions indicating that moving to Rolldown-Vite is expected to resolve many tree-shaking and DX issues, particularly for large projects using Nuxt UI. However, as of now, this is still experimental and not yet the default or fully stable path for all users. Some issues, like SSR inline styles and plugin compatibility, are still being worked on, and the migration is opt-in for now feat(nuxt,vite): add experimental support for
rolldown-vite, perf(vite): use rolldown's replace plugin when applicable.
Tree-Shaking Improvements in Nuxt
There have been recent improvements to tree-shaking in Nuxt core, such as:
- Tree-shaking client-only components from the server bundle (experimental.treeshakeClientOnly is enabled by default) Docs > 3.x > Api > Nuxt Configuration > experimental.
- More aggressive tree-shaking of unused composables and error handlers refactor(nuxt): improve implementation of error composables.
- AST-aware tree-shaking and route injection to replace older, less reliable methods fix(nuxt): migrate to AST-aware tree-shaking + route injection.
However, these improvements may not fully resolve the specific issues with Nuxt UI (Reka) until the underlying Vite builder is switched to Rolldown.
What You Can Do Now
- Stay Updated: Keep your Nuxt and Nuxt UI dependencies up to date, as improvements are landing frequently.
- Experimental Features: If you are comfortable with experimental features, you can try enabling the latest experimental options in your nuxt.config.ts, such as viteEnvironmentApi and any tree-shaking related flags. But be aware that these may not fully resolve the issue yet feat(kit,vite): allow enabling vite environment api.
- Minimize Imports: Only import and use the components you need, and avoid wildcard imports, as this can sometimes help with tree-shaking in the interim.
- Monitor Rolldown-Vite Progress: The Nuxt team is making rapid progress on Rolldown-Vite. You can follow the related PRs and test the experimental builder if you are able to, but production readiness is not guaranteed yet YouTube [Nuxt 3]: FASTER Nuxt Production builds with 3 lines of changes.
Summary
Unfortunately, based on the current knowledge sources, there is no definitive workaround for the Nuxt UI tree-shaking issue until Rolldown-Vite becomes stable and is adopted as the default builder. The best course of action is to keep your dependencies updated, try experimental features if you can, and monitor the progress of Rolldown-Vite integration. If development is truly blocked, you may need to wait for these upstream improvements to land.
If you have not already, you might also consider opening a minimal reproduction and sharing it with the Nuxt team, as this can sometimes help prioritize fixes.
Let me know if you need more specific guidance on enabling experimental features or tracking the progress of these changes.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@779106232446877727> Kapa.ai is still learning and improving, please let me know how I did by reacting below.