You’re likely experiencing a problem with the order of your operations. You’re defining your own App
component that uses the v-app
component before you’ve even told Vue to make use of it, so Vue assumes you’re using your own custom v-app
component.
Place Vue.use(Vuetify)
before starting any Vue instances via new Vue()
that require Vuetify components, or place it within the component definitions themselves right at the top of the <script>
tag after importing Vue and Vuetify within the single file component. Don’t worry if you have more than one Vue.use(Vuetify)
statement because only the first one will do anything–all subsequent calls will simply do nothing.
Original – Vue.use()
is called before new Vue()
, resulting in an error.
new Vue({
el: "#app",
components: { App },
template: "<App/>"
});
Vue.use(Vuetify);
Fix – Calling new Vue()
after Vue.use()
allows Vue to resolve the dependency correctly.
Vue.use(Vuetify);
new Vue({
el: "#app",
components: { App },
template: "<App/>"
});