TenerifeGuy
Hot Module Reload and Auto-Imports lost for components placed in the pages/**/components structure
One way of structuring pages and components is to place some components used only in that specific page into its components folder.
1. in pages eg.
pages/dashboard/components/SpecialComponent.vue
used only in pages/dashboard/index.vue
(I know, not recommended by default)
2. in .nuxtignore
we set the components folder to not generate routes with /pages/**/components/**
3. when using the SpecialComponent.vue
in the pages/dashboard/index.vue
the auto-import is lost (we need to import it in the script setup)
4. when using the SpecialComponent.vue
in the pages/dashboard/index.vue
the hot module reload is lost (any changes require project rebuild)
Question 1. Is it possible to introduce auto-imports for point 3 in nuxt 3 or is there a configuration for this already in the current nuxt 3 state?
Question 2. Is it possible to add the Hot Module Reload to components that are nested in the pages structure in nuxt 3 or is there a configuration already to enable it in the current nuxt 3 state?
It might sound silly to mix components with the router, but there is a special case for keeping "private" components nested in the router. Please don't shout at me 😄 Hope there are solutions to keep these components as regular components with auto-imports and hot module reload.
Thank you for any advice!
PS. I know the correct way is to keep components in components/ 🙂1 replies