Nothing happens ...

[eugenevk]

Hi,

I have installed v-tooltip and included the following code in my main.js:

import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import VTooltip from 'v-tooltip'

const app = createApp(App)

app.use(router).mount('#app')
app.use(VTooltip)

In a component I have this example:

<div class="cursor-pointer text-primary-blue-900 font-bold hover:text-primary-red-900" @click="logout" v-tooltip="'Logout'">
   <i class="bi bi-box-arrow-right text-xl" />
</div>

but nothing happens, no popup or anything. What am I doing wrong?

[hewok]

Hi, follow this link: https://github.com/Akryum/v-tooltip/blob/vue3/packages/docs/src/guide/installation.md

You need to add the style.

[eugenevk]

Thanks, but I get this error:

PS C:\...> npm i -S v-tooltip@vue3
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! Found: [email protected]
npm ERR! node_modules/vue
npm ERR!   peerOptional vue@"^2 || ^3.0.0-0" from @vue/[email protected]
npm ERR!   node_modules/@vue/babel-preset-app
npm ERR!     @vue/babel-preset-app@"^4.5.12" from @vue/[email protected]
npm ERR!     node_modules/@vue/cli-plugin-babel
npm ERR!       dev @vue/cli-plugin-babel@"~4.5.0" from the root project
npm ERR!   peer vue@"3.0.7" from @vue/[email protected]
npm ERR!   node_modules/@vue/compiler-sfc
npm ERR!     peerOptional @vue/compiler-sfc@"^3.0.0-beta.14" from @vue/[email protected]
npm ERR!     node_modules/@vue/cli-service
npm ERR!       peer @vue/cli-service@"^3.0.0 || ^4.0.0-0" from @vue/[email protected]
npm ERR!       node_modules/@vue/cli-plugin-babel
npm ERR!         dev @vue/cli-plugin-babel@"~4.5.0" from the root project
npm ERR!       3 more (@vue/cli-plugin-router, @vue/cli-plugin-vuex, the root project)
npm ERR!     dev @vue/compiler-sfc@"^3.0.0" from the root project
npm ERR!   3 more (@vueup/vue-quill, vue-router, the root project)
npm ERR!
npm ERR! Could not resolve dependency:
npm ERR! v-tooltip@"4.0.0-alpha.1" from the root project
npm ERR!
npm ERR! Conflicting peer dependency: [email protected]
npm ERR! node_modules/vue
npm ERR!   peer vue@"^3.0.11" from [email protected]
npm ERR!   node_modules/v-tooltip
npm ERR!     v-tooltip@"4.0.0-alpha.1" from the root project
npm ERR!
npm ERR! Fix the upstream dependency conflict, or retry
npm ERR! this command with --force, or --legacy-peer-deps
npm ERR! to accept an incorrect (and potentially broken) dependency resolution.

I am running @vue/cli 4.5.11

[Akryum]

Did you follow the steps?

Hi, follow this link: https://github.com/Akryum/v-tooltip/blob/vue3/packages/docs/src/guide/installation.md

You need to add the style.

This link is for the Vue 3 version

[hewok]

I assumed it was vue 3 because 'createApp' is used in the shared initialization code.

[Akryum]

Oh right 👀

[hewok]

@eugenevk, run npm install v-tooltip@vue3 --save or yarn add v-tooltip@vue3 Then follow the other step "Install the plugin into your Vue app:" or "Or use the directives and components directly:".

[eugenevk]

Indeed, I'm using Vue 3 (Composition API). Apologies I didn't mention that. I get the errors I mentioned above when trying to install (https://github.com/Akryum/v-tooltip/issues/718#issuecomment-842289954)

[rendomnet]

Same here "vue": "^2.6.10", "v-tooltip": "^2.1.3"