Ricerca nel sito web

typescript - La proprietà '$vuetify' non esiste sul tipo - quando si usa Nuxt.js con Vuetify


Ho questo errore per una parte particolare del codice quando accedo a this.$vuetify nella mia app Nuxt.js.

 ERROR  ERROR in components/equipment/QuickInfoCard.vue:21:20                                                                                                                   19:51:29
TS2339: Property '$vuetify' does not exist on type '{ width(): string; height(): "100%" | "9em"; }'.
    19 |     },
    20 |     height() {
  > 21 |       switch (this.$vuetify.breakpoint.name) {
       |                    ^^^^^^^^
    22 |         case 'sm': return "9em"
    23 |         default: return "100%"
    24 |       }

Ho già provato ad aggiungere il tipo TS visto che era una soluzione suggerita

// tsconfig.json
"compilerOptions: [
    ...
    "types": [
      "@nuxtjs/vuetify", // <<
      "@types/underscore",
      "@types/node",
      "@nuxt/types",
      "@nuxtjs/auth-next"
    ]
    ...
]

Risposta n. 1

Per favore, verifica se hai '@nuxtjs/vuetify' all'interno dei buildModules nella tua configurazione di Nuxt.

Successivamente, prova ad accedere a vuetify tramite il globale $nuxt, per esempio: this.$nuxt.vuetify

Buona fortuna!

Risposta n. 2

Potresti aver aperto il tuo editor nella directory sbagliata, causando il mancato ritrovamento di file come il tuo package.json e tsconfig.json. Se usi VSCode, il comando "code ." deve aprire esattamente la directory del progetto, altrimenti può verificarsi questo errore. Spero che questo aiuti!