Based on Setup Vuetify V2 With Nuxt V3.
Edit nuxt.config.ts
import vuetify from 'vite-plugin-vuetify'export default defineNuxtConfig({ css: ['vuetify/lib/styles/main.sass'], modules: [ async (options, nuxt) => { nuxt.hooks.hook('vite:extendConfig', config => config.plugins.push( vuetify() )) } ]})Edit plugins/vuetify.ts
import { createVuetify } from 'vuetify'// import * as components from 'vuetify/components'// import * as directives from 'vuetify/directives'export default defineNuxtPlugin(nuxtApp => { // https://next.vuetifyjs.com/en/getting-started/installation/#manual-steps // https://next.vuetifyjs.com/en/features/treeshaking/ const vuetify = createVuetify({ // theme: false, }) nuxtApp.vueApp.use(vuetify)})If you don't like/trust treeshaking, you can also import component manually.
<script setup>import { VApp } from 'vuetify/components/VApp'import { VAppBar } from 'vuetify/components/VAppBar'import { VBtn } from 'vuetify/components/VBtn'import { VContainer } from 'vuetify/components/VGrid'import { VFooter } from 'vuetify/components/VFooter'import { VSheet } from 'vuetify/components/VSheet'</script>NOTE: Treeshaking only apply to dynamic import of components and it's CSS, it still import the entire base CSS and Themes. You might want to explore Replace Vuetify Utilities And Color Pack With Tailwind CSS.
References: