useI18n will make vueuse clipboard support wrong

[Wang Wei]

Reporting a bug?

1. vueuse is a wide spreading utility lib
2. when import useI18n, and import useClipboard
3. the clipboard isSupported will turn to be false in all browser

Expected behavior

expect useI18n not affect useClipboard

Reproduction

<script setup lang="ts"> import { useClipboard } from '@vueuse/core' import { useI18n } from 'vue-i18n'; // you can try comment this line, will make isSupported == true const { text, isSupported, copy } = useClipboard() </script>

supported: {{ isSupported }}

System Info

System:
    OS: Linux 5.15 Ubuntu 22.04.3 LTS 22.04.3 LTS (Jammy Jellyfish)
    CPU: (4) x64 Intel(R) Xeon(R) Gold 6462C
    Memory: 5.39 GB / 7.13 GB
    Container: Yes
    Shell: 5.1.16 - /bin/bash
  Binaries:
    Node: 20.11.1 - ~/.nvm/versions/node/v20.11.1/bin/node
    npm: 10.2.4 - ~/.nvm/versions/node/v20.11.1/bin/npm
  npmPackages:
    @vitejs/plugin-vue: ^5.0.4 => 5.0.4 
    @vue/eslint-config-prettier: ^9.0.0 => 9.0.0 
    @vue/eslint-config-typescript: ^13.0.0 => 13.0.0 
    @vue/test-utils: ^2.4.5 => 2.4.6 
    @vue/tsconfig: ^0.5.1 => 0.5.1 
    vite: ^5.2.8 => 5.2.11 
    vite-plugin-externals: ^0.6.2 => 0.6.2 
    vite-plugin-vue-devtools: ^7.0.25 => 7.2.0 
    vitest: ^1.4.0 => 1.6.0 
    vue: ^3.4.21 => 3.4.27 
    vue-i18n: ^9.13.1 => 9.13.1 
    vue-router: ^4.3.0 => 4.3.2 
    vue-tsc: ^2.0.11 => 2.0.19 
    vue-virtual-scroller: ^2.0.0-beta.8 => 2.0.0-beta.8

Screenshot

No response

Additional context

No response

Validations

• Read the Contributing Guidelines
• Read the Documentation
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussions

[github-actions]

Thank you for your feadback!
Would you be able to provide a reproduction 🙏

More info

Why do I need to provide a reproduction?

Reproductions make it possible for us to triage and fix issues quickly with a relatively small team. It helps us discover the source of the problem, and also can reveal assumptions you or we might be making.

What will happen?

If you've provided a reproduction, we'll remove the label and try to reproduce the issue. If we can, we'll mark it as a bug and prioritise it based on its severity and how many people we think it might affect.

If Status: Need More Info labeled issues don't receive any substantial activity (e.g., new comments featuring a reproduction link), we'll close them. That's not because we don't care! At any point, feel free to comment with a reproduction and we'll reopen it.

How can I create a reproduction?

We have a couple of templates for starting with a minimal reproduction:

👉 Reproduction mininal starter
👉 Reproduction starter with unpluguin-vue-i18n

A public GitHub repository is also perfect. 👌

Please ensure that the reproduction is as minimal as possible.

You might also find these other articles interesting and/or helpful:

• The Importance of Reproductions
• How to Generate a Minimal, Complete, and Verifiable Example

[Wang Wei]

create vite vue3 project,
npm add vue-i18n and vueuse.

<script setup lang="ts"> 
import { useClipboard } from '@vueuse/core' 
import { useI18n } from 'vue-i18n';
const { text, isSupported, copy } = useClipboard();

// just try comment this line
const {t} = useI18n(); 

</script>

<template>
supported: {{ isSupported }}
</template>