floating-vue: [Vue warn]: Failed to resolve directive: tooltip

Using the example from the README, I get [Vue warn]: Failed to resolve directive: tooltip

on Vue 2.4.4 and Webpack 3.6.0

About this issue

  • Original URL
  • State: closed
  • Created 7 years ago
  • Reactions: 4
  • Comments: 50 (21 by maintainers)

Most upvoted comments

after a few hours of head bashing I figured it out:

I’ve used import Vue from 'vue' => the mentioned error. Changing import Vue from 'Vue' (capital V) => it worked

Never happened this before. Any ideas as of why ?

By the way, I wanted to apologize for the "this package is foobar’ comment … I was frustrated. The reality is that I use your package on EVERY page of my app as much as 20 - 30 times per page … the notation is precise and concise and absolutely solved my problem before.

It’s a GREAT package but now something is broken … please accept my apology.

Did you try this?

import Vue from 'vue'
import { VTooltip, VPopover } from 'v-tooltip'

Vue.directive('tooltip', VTooltip)
Vue.component('v-popover', VPopover)

Also, could you log the result of the import?

import VTooltip from 'v-tooltip'

console.log(VTooltip)

Make sure you are doing all of this before launching the app with new Vue. Plugins should always be installed before that.

import Vue from 'vue'
import VTooltip from 'v-tooltip'

Vue.use(VTooltip)

new Vue({
  // ...
})

@jongravois Don’t worry, I know that feeling. 😄 Let’s work out your issue! 👍