With Nuxt 4 + Layers + Rolldown Vite, sometimes auto-imported component does not exists
Only happened in some layers, where using components via auto-import in other layers doesnt work on first page load (navigation will fail, first page load would fail). But when I save the file, the component would work as expected.
I dont know how to repro this as it has weird behaviors
8 Replies
Hi @LeFt_HitD. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
This issue sounds similar to known problems with Nuxt 4, layers, and the experimental rolldown-vite builder, especially around component resolution and auto-imports. There have been several reports of unpredictable or inconsistent behavior with auto-imported components, particularly when using layers and rolldown-vite. Some users have experienced components not being available on first load or navigation, but then working after a file save or rebuild.
Key points from the knowledge sources:
- There was a bug where component priority did not respect the correct layer order, making component resolution unpredictable when multiple layers defined the same component. This was fixed by assigning priority based on layer index, ensuring the documented priority order is respected. If you are not on a version with this fix, you may encounter such issues. The fix is described here: fix(nuxt): correct layer priority order for extends and auto-scanned layers.
- Rolldown-vite integration has been unstable and is still considered experimental. There have been multiple issues with hydration, plugin replacement, and auto-imports not working as expected, especially after Nuxt 4.1.3. Many of these issues were fixed in later Nuxt 4.2.x releases and with updates to rolldown-vite (notably v7.2.0-beta.2 and above) fix(vite): use rolldown replace only in build.
- Users have reported that issues with auto-imports and component resolution can sometimes be resolved by updating to the latest Nuxt nightly and the latest rolldown-vite, and by ensuring a clean install (deleting node_modules, .nuxt, and lockfiles before reinstalling) Github Issue (closed): [v4.1.3] rolldown-vite: Nuxt does not initialize correctly.
- If you are using both extends and auto-scanned layers, be aware that the order and naming of layers can affect which components are resolved. Using number prefixes in layer folder names can help control priority fix(nuxt): correct layer priority order for extends and auto-scanned layers.
Recommendations:
1. Make sure you are using the latest Nuxt 4.2.x (or nightly) and the latest rolldown-vite (v7.2.0-beta.2 or newer).
2. Clean your project by deleting node_modules, .nuxt, and your lockfile, then reinstall dependencies.
3. If you use both extends and auto-scanned layers, control their order with number prefixes or by moving layers outside ~/layers if you want to control order via extends only.
4. If the issue persists, it may be due to the experimental nature of rolldown-vite and unresolved edge cases. Consider switching to the stable Vite builder if possible, or follow updates on the relevant GitHub issues.
If you still encounter the problem after these steps, it may be a new or edge-case bug. In that case, providing a minimal reproduction (even if difficult) will help the Nuxt team investigate further.
Let me know if you need more specific troubleshooting steps!
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@189715647293423616> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai does rolldown-vite have cache folder? where is it located at?
Let me check the knowledge base for you again. One moment! :books:
----------------------
I'm sorry, but the knowledge sources do not contain explicit information about whether rolldown-vite creates a cache folder or where it would be located. There are discussions about build cache locations and related fixes in Nuxt, but nothing specifically details a cache directory for rolldown-vite itself. If you need precise details about rolldown-vite's caching behavior or folder structure, I recommend checking the official rolldown or rolldown-vite documentation or repository.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@189715647293423616> Kapa.ai is still learning and improving, please let me know how I did by reacting below.
@kapa.ai update, if i name the page to
other.vue, it would work as expected, but other name doesnt workLet me check the knowledge base for you again. One moment! :books:
----------------------
I'm sorry, but the knowledge sources do not contain any information about issues where renaming a page to
other.vue makes it work, while other names do not. There are discussions about unpredictable component resolution and auto-import issues with layers and rolldown-vite, but nothing specifically about page file names affecting behavior in this way.
If this behavior persists, it may be related to the broader issues with layers, auto-imports, and rolldown-vite's experimental status, but there is no explicit mention or explanation of this specific symptom in the provided sources.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@189715647293423616> Kapa.ai is still learning and improving, please let me know how I did by reacting below.