Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

A-La-Carte error: [Vue warn]: Failed to resolve directive: touch (found in <VTabsItems>)

See original GitHub issue

Steps to reproduce

I switched from ‘standard’ vuetify to ‘a la carte’. Now when using tabs i get the following error:

[Vue warn]: Failed to resolve directive: touch

(found in <VTabsItems>)
warn @ vue.runtime.esm.js?ff9b:472
resolveAsset @ vue.runtime.esm.js?ff9b:1417
normalizeDirectives$1 @ vue.runtime.esm.js?ff9b:5838
_update @ vue.runtime.esm.js?ff9b:5765
updateDirectives @ vue.runtime.esm.js?ff9b:5757
invokeCreateHooks @ vue.runtime.esm.js?ff9b:5295
createElm @ vue.runtime.esm.js?ff9b:5186
patch @ vue.runtime.esm.js?ff9b:5657
Vue._update @ vue.runtime.esm.js?ff9b:2446
updateComponent @ vue.runtime.esm.js?ff9b:2570
get @ vue.runtime.esm.js?ff9b:2913
Watcher @ vue.runtime.esm.js?ff9b:2902
mountComponent @ vue.runtime.esm.js?ff9b:2574
Vue$3.$mount @ vue.runtime.esm.js?ff9b:7515
init @ vue.runtime.esm.js?ff9b:3559
createComponent @ vue.runtime.esm.js?ff9b:5208
createElm @ vue.runtime.esm.js?ff9b:5151
createChildren @ vue.runtime.esm.js?ff9b:5279
createElm @ vue.runtime.esm.js?ff9b:5184
patch @ vue.runtime.esm.js?ff9b:5657
Vue._update @ vue.runtime.esm.js?ff9b:2446
updateComponent @ vue.runtime.esm.js?ff9b:2570
get @ vue.runtime.esm.js?ff9b:2913
Watcher @ vue.runtime.esm.js?ff9b:2902
mountComponent @ vue.runtime.esm.js?ff9b:2574
Vue$3.$mount @ vue.runtime.esm.js?ff9b:7515
init @ vue.runtime.esm.js?ff9b:3559
--- snipped ---

Versions

Latest Vue and Vuetify

Reproduction Link

Sorry, it is a la carte

Issue Analytics

State:
Created 6 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

4reactions

MartonEstokcommented, Jun 3, 2018

I think @KaelWD means this:

import Touch from 'vuetify/es5/directives/touch'

Vue.use(Vuetify, {
  components: {
    your components
  },
  theme: {
    your theme color definitions
  },
  directives: {
    Touch
  }
})

This way you don’t have to import all directives, just the ones you use.

3reactions

nekosaurcommented, Oct 12, 2017

He fixed it in commit 9b6b0fd. It will be available next release.

A temporary workaround is to do the following

import * as directives from 'vuetify/es5/directives'

Vue.use(Vuetify, {
  components: { your components },
  directives
})

Top Results From Across the Web

Failed to resolve directive: touch · Issue #30 - GitHub

We have a Modal component on the https://github.com/nextcloud/nextcloud-vue library and we wanted to use your library, though when importing the modal component ...

[Vue warn]: Failed to resolve directive: touch (found in

Please repeat the password. Topic: [Vue warn]: Failed to resolve directive: touch (found in <MdbCarousel>) Please insert min. 20 characters.

[Vue warn]: Failed to resolve directive: bin - Stack Overflow

Hi although my app is working I am getting this error in my console which blocks the jQuery. v-for="message in messages" looping throught...

[Vue warn]: Failed to resolve directive: mode - Laracasts

I have been using Vue 2 for a couple of weeks now and recently I started to receive the following error: [Vue warn]:...

[vue warn]: failed to resolve component - You.com

I got the same issue and put around 2 hours to figure out. The only problem with me was my browser was getting...