Hello every One I Have Some Problem That I beleive It Came From Vite Complier
i use vue 3 & vite with vuetify 3 beta And i need to use render function with vuetify
But every Time I try to import vuetify component i get this error

But the file does exist
Here Is My Code : RenderFunc.js
<script>
import { h } from "vue";
import { VCard } from 'vuetify/lib/components';
export default {
props: {
level: {
default: 1
}
},
setup({ level }, { slots }) {
return () => h(VCard, 'hello')
}
};
</script>
And This Is My Vite Config That i believe the fix it in
import { fileURLToPath, URL } from 'node:url'
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
// https://github.com/vuetifyjs/vuetify-loader/tree/next/packages/vite-plugin
import vuetify from 'vite-plugin-vuetify'
// https://vitejs.dev/config/
export default defineConfig({
plugins: [
vue(),
vuetify({ autoImport: true }),
],
resolve: {
alias: {
'@': fileURLToPath(new URL('./src', import.meta.url))
}
}
})
And This My Main.js file
import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import vuetify from './plugins/vuetify'
import { createPinia } from 'pinia'
import { loadFonts } from './plugins/webfontloader'
loadFonts()
createApp(App)
.use(router)
.use(vuetify)
.use(i18n)
.use(createPinia())
.mount('#app')
and this my vuetify plugin file
// Styles
import '@mdi/font/css/materialdesignicons.css'
import 'vuetify/styles'
// Vuetify
import { createVuetify } from 'vuetify'
export default createVuetify({
theme:{
themes:{
light:{
colors:{
background: '#F9F9F9'
}
}
}
}
}
)
So Any One Can help how can i find the solution
Fixed my own problem, the whole thing was about the import path of Vuetify components in
src/plugins/vuetify.jsI just used
instead of
Hope it help you too