Vue 3.0 compatibility

[cjblomqvist]

Currently v-clipboard doesn't work with Vue 3.0, which is now in RC and supposedly soon to be released.

[M1CK431]

It was fixed in #23 .
However the code is still lacking some logic to handle both vue 2 and vue 3.

Currently to use this lib in vue 3 we have to:

1. install it directly from this repo => yarn add https://github.com/euvl/v-clipboard
2. import it from src dir => import Clipboard from "v-clipboard/src";
3. in main.js, use the new vue 3 app.use syntaxe => const app = createApp(App); app.use(Clipboard);

[M1CK431]

Hi @cjblomqvist ,

I just open a PR which add the logic to handle both vue 2 and vue 3.
Hope it will not take so long time to see it released on NPM 🤞

[ajmas]

Any updates on Vue3 support?

If it is challenging to support, maybe use the 2.x release tree for vue2 and 3.x release tree for vue3?

[M1CK431]

@ajmas There's no challenge at all. The code is ready since months but @euvl seems asleep... Take a look on linked PR for details.

Waiting for @euvl wake up, I'm personally using my fork this way:

• in package.json

{
  "dependencies": {
    "v-clipboard": "https://github.com/M1CK431/v-clipboard"
  }
}

• in main.js

import { createApp } from "vue";
import clipboard from "v-clipboard/src/index";
import App from "./App.vue";

const app = createApp(App);
app.use(clipboard);

Hope it helps.

[ajmas]

I just ended up abandoning the use of this component and just used the API straight:

onClickCopyToClipboard () {
  const myText = 'blah';
  navigator.clipboard.writeText(myText);
}

I didn't really need more functionality than that.

With a number of Vue related packages not being updated for Vue3, I am looking to see which ones really need updating and which ones can just be dropped for something more basic, like in this case.

[M1CK431]

Be careful @ajmas, compat is not so good with this API, especially IE11: https://caniuse.com/?search=navigator.clipboard
This plugin use document.execCommand which is better in this respect: https://caniuse.com/?search=document.execCommand

However, if your projet target decent browser version, you are probably free to go 😉

[ajmas]

@M1CK431 Thanks for the info and I'll take that into consideration. and adjust accordingly. Right now the oldest MS browser we are targeting is Edge.

At the same time execCommand is considered deprecated, so it will be a balancing act:

https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Interact_with_the_clipboard

[M1CK431]

Thanks a lot for this documentation link, I was not aware about all that details. It will be excessively useful for anyone which would have to make a choice regarding how to implement clipboard related features 👌🏼