How to import color pack in Vuetify3 and Nuxt3?

[Rakantor]

I tried import colors from 'vuetify/lib/util/colors' as shown in the v3 docs but I'm getting a Cannot find module (ts2307) error. I also tried the imports below, resulting in the same error:

// Cannot find module ... (ts2307)

import colors from 'vuetify/util/colors'
import colors from 'vuetify/colors'
import colors from 'vuetify/src/util/colors'
import colors from 'vuetify/es5/util/colors'

// plugins/vuetify.ts

import { createVuetify, ThemeDefinition  } from 'vuetify'
import * as components from 'vuetify/components'
import * as directives from 'vuetify/directives'
import '@mdi/font/css/materialdesignicons.css'
import colors from 'vuetify/lib/util/colors' // not working

const myCustomDarkTheme: ThemeDefinition = {
  dark: true,
  colors: {
    background: '#0A192F',
    primary: '#64FFDA',
    accent: colors.grey.darken3,
    secondary: colors.amber.darken3,
    info: colors.teal.lighten1,
    warning: colors.amber.base,
    error: colors.deepOrange.accent4,
    success: colors.green.accent3
  }
}

export default defineNuxtPlugin(nuxtApp => {
  const vuetify = createVuetify({
    components,
    directives,
    theme: {
      defaultTheme: 'myCustomDarkTheme',
      themes: {
        myCustomDarkTheme,
      }
    }
  })

  nuxtApp.vueApp.use(vuetify)
})

// nuxt.config.ts

import vuetify from 'vite-plugin-vuetify'

export default defineNuxtConfig({
  css: ['vuetify/styles'],
  vite: {
    ssr: {
      noExternal: ['vuetify'] // add the vuetify vite plugin
    }
  },
  build: {
    transpile: ['vuetify']
  },

  plugins: [],

  modules: [
    // this adds the vuetify vite plugin
    async (options, nuxt) => {
      nuxt.hooks.hook('vite:extendConfig', config => config.plugins.push(vuetify()))
    }
  ]
})

[WIStudent]

I ran into the same issue. This might be a bug in vuetify. vuetify/lib/util/colors is there but the typescript definitions are missing. Try the following to suppress the typescript error:

// @ts-expect-error Missing type definitions
import colors from "vuetify/lib/util/colors";

[Rakantor]

Thank you.