vue vite dynamic components import

Viewed 344

I am migrating an existing laravel ineria from mix to vit.

I did all the steps in the migration guid and everything works fine except for one thing.

I have a component receives a prop conatains an array of components.

I used to require them like this (inside a loop)

...

this.$options.components[component_name] = require(`@/Pages/Components/Inputs/${component_name}`).default

...

this wont work with vite because of "require", I have to replace it with import

so I tried these ways and none of them works

this.$options.components[component_name] = () => resolvePageComponent(`./Pages/Components/Inputs/${component_name}.vue`, import.meta.glob('./Pages/**/*.vue'))


this.$options.components[component_name] = () => resolvePageComponent(`@/Pages/Components/Inputs/${component_name}.vue`, import.meta.glob('./Pages/**/*.vue'))

this.$options.components[component_name] = resolvePageComponent(`./Pages/Components/Inputs/${component_name}.vue`, import.meta.glob('./Pages/**/*.vue'))

this.$options.components[component_name] = resolvePageComponent(`@/Pages/Components/Inputs/${component_name}.vue`, import.meta.glob('./Pages/**/*.vue'))

all of them throws the same exception

"Uncaught (in promise) Error: Page not found: ./Pages/Components/Inputs/Text.vue".
0 Answers
Related