Not working in Vue version 3 WebComponent.

[DivakarSS]

I'm submitting a ... (check one with "x")

[x] bug report => see 'Providing a Reproducible Scenario'
[] feature request => do not use Github for feature requests, see 'Customers of AG Grid'
[] support request => see 'Requesting Community Support'

• Project converting it into vue 3 WebComponents. Current behavior It is working as per our requirement in local environment, but after converting it into WebComponents it is not working. I provided a Github repository link here for your reference. I am uploading the Screenshot for you reference. This Screenshot shows how it is working in local Environment. This Screenshot shows how it working in WebComponent.

Expected behavior This should work after convert it into WebComponents as how it is worked in local environment.

Please tell us about your environment: O.S: Windows 10 IDE: VS Code Package Manager: npm

• vue-tippy: 6.0.0
• Browser: 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/107.0.0.0 Safari/537.36'
• Vue: 3.2.13
• TypeScript: 4.5.5

[KABBOUCHI]

u are creating an app and never mounting it

you can import directive and component directly

<script setup>
import { directive as VTippy, Tippy } from 'vue-tippy'
</script>

<template>
<button v-tippy="'Hello!'">
  Tippy!
</button>

<tippy content="Hi!">
  <button>Tippy!</button>
</tippy>
</template>

[DivakarSS]

import {directive as VTippy} from 'vue-tippy' const app = createApp({}); app.use(VTippy); app.mount('#app'); I used like this, but still in WebComponent it is not working. You can run the demo.html file in dist folder, that is the WebComponent file. I am using "build-installed-base": "vue-cli-service build --mode production --modern --target lib --inline-vue --name tippy-tooltip ./src/index.ts" command in package.json to convert the component to WebComponent.

[DivakarSS]

import { directive } from 'vue-tippy'export default{ directives: { tippy: directive, } } I Imported and registered like this. Now it is working in WebComponents. Thank You.