Search code examples
vue.jsvuejs2vuetify.jsvue-clivue-cli-3

"[Vue warn]: Unknown custom element: ..." Error, when using vuetify UI components with the vue-cli-plugin-vuetify


My project setup is using vue-cli with vue-cli-plugin-vuetify. When i want to use any of the List Components, the browser console throws errors on most of the vuetify elements, like:

[Vue warn]: Unknown custom element: <v-list-item-content> - did you register the component correctly? For recursive components, make sure to provide the "name" option.

My guess is that i need to do some extra configuration on the file /plugins/vuetify.js to make the lists work but i don't know how.

My file vuetify.js looks like this:

import Vue from 'vue'
import Vuetify from 'vuetify/lib'

import 'vuetify/src/stylus/app.styl'

Vue.use(Vuetify, {
  iconfont: 'md',
})

main.js:

import Vue from 'vue'
import './plugins/vuetify'
import App from './App.vue'
import router from './router'
import store from './store'

Vue.config.productionTip = false

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')

Questions: How can i make all components from vuetify work??

Thanks for your help!

EDIT:

Basically, what i did was creating a new project with vue create projectX and then added vuetify with vue add vuetify. And now i want to be able to use the examples from the vuetify documentation. But copy&pasting the examples results in the described error...


Solution

  • Try updating vuetify with: npm install -S vuetify@2.0.1