How to connect Vue 3 with Vuetify?

vue.js vuetify.js vuejs3
AndrewBro picture AndrewBro · Jul 13, 2020 · Viewed 12.4k times · Source

I initialized a new, empty Vue application using Vue version 3. I then tried to add the plugin Vuetify with the command vue add vuetify, but received the following error. Any ideas on how to solve it?

Error: You cannot call "get" on a collection with no paths.

Answer

Andre Ravazzi picture Andre Ravazzi · Sep 21, 2020

While there is no Vuetify 3, I'd use Vue 2.x with Vuetify 2.x and install the Composition API as a package/plugin:

npm install @vue/composition-api

Then importing to your project (in main.js):

import Vue from 'vue'
import VueCompositionAPI from '@vue/composition-api'

Vue.use(VueCompositionAPI)

And finally using it in your component:

// use the APIs
import { ref, reactive } from '@vue/composition-api'

Just be aware of the limitations of this method.

Related questions

Center content vertically on Vuetify

Is there a way to center content vertically in Vuetify? With the text-xs-center helper class, the content gets centered horizontally only: <v-container grid-list-md text-xs-center> <v-layout row wrap> <v-flex xs12> Hello </v-flex> </…

Read More
File upload in vuetify

I'm using vuetify components for front-end in Vuejs. I want to create a user registeration form with file upload. I'm able to create a form using v-text-field in vuetify but how to upload the file. Which component to use or …

Read More
How to set the height of vuetify card

I am attempting to add a card with vue and vuetify that will take up the space in my container using v-flex to create a horizontal card that acts the same way vertically. I have attempted to add a height …

Read More