` component which emits startGame_\r\n\r\nHere is the code:\r\n```\r\n\u003Ctemplate>\r\n \u003CModal @startGame=\"startGame\" />\r\n\u003C/template>\r\n\r\n\u003Cscript>\r\nimport { useSound } from '@vueuse/sound'\r\nimport bgAudio from '@/assets/audio/stranger-things.mp3'\r\n\r\nexport default {\r\n setup() {\r\n const { play } = useSound(bgAudio)\r\n\r\n const startGame = () => {\r\n /* other codes here */\r\n play()\r\n }\r\n return {\r\n startGame\r\n }\r\n }\r\n}\r\n\u003C/script>\r\n```\r\n",[],"TypeError: Cannot read properties of undefined (reading 'version')","2022-11-25T02:10:33Z","https://github.com/vueuse/sound/issues/17",0.6864717,{"description":3160,"labels":3161,"number":3162,"owner":3138,"repository":3139,"state":3140,"title":3163,"updated_at":3164,"url":3165,"score":3166},"I just tried to use vueuse/sound in my Nuxt 3 project like so:\r\n```\r\nconst {play} = useSound(\"/sounds/alert.mp3\");\r\n```\r\n\r\nI am getting the following error:\r\n```\r\nUncaught (in promise) TypeError: HowlConstructor.value is not a constructor\r\n```\r\nwhich is [raised here](https://github.com/vueuse/sound/blob/3c4978bb07c3ef9638c0054e0e4a90923aca982c/src/index.ts#L29). \r\n\r\n`@vueuse/sound` version: 2.0.0\r\nThe `howler` version installed by my package manager is: 2.2.3. ",[],32,"TypeError: HowlConstructor.value is not a constructor","2023-07-06T12:32:02Z","https://github.com/vueuse/sound/issues/32",0.6971594,{"description":3168,"labels":3169,"number":3173,"owner":3138,"repository":3138,"state":3140,"title":3174,"updated_at":3175,"url":3176,"score":3177},"### Describe the bug\r\n\r\nWhen calling `until` on a ref of an array, _e.g._ `until(ref([]))`, the response does not include \"all the methods\". It is of type `UntilArrayInstance`.\r\n\r\nBut when I use `until` on a ref that may be `undefined`, something weird is happing. In any cases, the return type is `UntilValueInstance`, but at *runtime*:\r\n1) If the ref is initialized with undefined, _e.g._ `until(ref\u003Cstring[]>())`, then the returned value corresponds to the type as expected\r\n2) If the ref is initialized with any array, _e.g._ `until(ref\u003Cstring[]>([]))` then the returned value corresponsed to `UntilArrayInstance` interface\r\n\r\nIs it by design ? This makes really difficult to rely on TS to handle the different possible cases. (It is possible that I have a computed which initial value is not known at the setup of the component, because coming from a store or things like that).\r\n\r\nFor instance, my code was throwing because I was relying on the inferred return type `UntilValueInstance` but the runtime returned object did not include the desired methods.\r\n\r\n\r\n### Reproduction\r\n\r\n[reproduction link](https://play.vueuse.org/#N4IgDghgxg1hDmBTAziAXAbVAOwgW0XRADcBXRAWgBNE8BLEAGhGQHtSAnKQtEU7MDHhMQNZFA50wAFzqtsRAGrkABABFadFQAoAFhAA2AMxV1sKgGIdE2KLoCUp5CogqaxRAdZgz8FaVkDOmkATxcDLwB3ZxD2FWlWFUjJaUQVAFVsOg8OZEMVZTSAGToAIw4ISRQVI1YOAtUAJhUAMhUAZhFOAyJdaWkwZDQAemH+QXgAOihWPGGyShp6YaDS4bMaAA9JvAArVABfRhx8HhAAAQXSZERh5H1rKhE2Tm4icaERMQkpWXkiADKD0QVAaiHSN38gWCdBQky6HB6vD6AyGow+Uxmc0u5Gut3ulRB5wAjAAGSbEyak9bYLY7fYgI4nAhEHGIPHDGbWZ7sLhnDFfFA-GRyBS8ADCrAiiCgf3MrBMKBu2Fk+UKKkleDArGQMPkGWhshQCKRIBRgxGYwEQmms2GbI5XMQJPJlOpG0Q2z2hwAuswjHQDMa0KAAIJgMCTBboUCpLUGCCpIjPYXSIh0LV1aQqYD+FWBlQHGocWYqADkDpunLqiDLAB0spmONnc1iwAEQYXi6WywsywBuBsN0YuZDIUgEeL6bPSXRpMww-LEQyqAAGGB9q5UWOqRhLeBcKmQCWsKlKAW3EGw2FY2dKaRgN8i5ivoJmpAMoPveZoAewIIbGZsGPFRlwMFQAF5t1mdtUiobRtEcCCAD4VA3ewh1wZAQlsGp+FlUV4hQaREJzBsVBcSIIGCPNAm0MD7EmG9pEmBIACFwVpRA-xBRDB2wA5MNSY8+MZZhJTqKgzETRAo3IGMQDjMAEyTXgAB4pOIciankaQILrEA8HkVgDO00p4H0kAgngPoKAAVlJUk3EqGA0CoFz7Mc0zzBqINNksgA-aCDG8ijUk2PSDO4FVEA4UKVDASzGni0pJNiyyS34GgqG85DtLU5BIHMcLIpAAAWTYQpAZDgFzMDVAOA41LuIq8p8gqiqIiLLOQA93I4VzrNsgBORznIGtBvGgYIQk8gyVDwSzpAoZLqoAWXYSFapUBN73AxrmsKq82uazTkJTSQZCIX8zEQAAFEtBm0YBtN2zw0BUAFpEkbB4EYbT6sQD6ADkJ3vDh-oE+xGUaoA)\r\n\r\n### System Info\r\n\r\n```Shell\r\nSystem:\r\n OS: macOS 14.1.1\r\n CPU: (11) arm64 Apple M3 Pro\r\n Memory: 154.41 MB / 36.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 18.18.2 - ~/.nvm/versions/node/v18.18.2/bin/node\r\n Yarn: 3.6.3 - ~/.nvm/versions/node/v18.18.2/bin/yarn\r\n npm: 9.8.1 - ~/.nvm/versions/node/v18.18.2/bin/npm\r\n Browsers:\r\n Chrome: 119.0.6045.123\r\n Safari: 17.1\r\n npmPackages:\r\n @vueuse/core: ^10.7.2 => 10.7.2\r\n vue: ^2.7.15 => 2.7.14\r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\nyarn\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://vueuse.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\r\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\r\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[3170],{"name":3171,"color":3172},"enhancement","a2eeef",3740,"Missing methods on `until` called on a maybe undefined array ref whilst listed by TS","2025-02-28T16:13:22Z","https://github.com/vueuse/vueuse/issues/3740",0.6975819,{"description":3179,"labels":3180,"number":3181,"owner":3138,"repository":3139,"state":3140,"title":3182,"updated_at":3183,"url":3184,"score":3185},"Hi @Tahul ,\r\n\r\nYou asked for my experience with nuxt and this package. I tried to get it to work after the latest update, but it seems like it doesn't work. I have a sound in my public folder like this : public/sounds/back.wav\r\n\r\n\r\n\r\n`\u003Cscript setup>\r\nimport { useSound } from '@vueuse/sound'\r\n\r\nconst { play, sound } = useSound('/sounds/back.wav')\r\n\u003C/script>\r\n\r\n\u003Ctemplate>\r\n \u003Cbutton @click=\"play \">\r\n test\r\n \u003C/button>\r\n\u003C/template>\r\n`\r\n\r\nThis is my test component\r\n\r\n` \r\n modules: ['@vueuse/sound/nuxt']\r\nsound: {\r\n sounds: {\r\n scan: true,\r\n },\r\n },`\r\n \r\n Did I have something wrong or do I need to change something to get it to work?\r\n \r\n Thanks in advance!",[],33,"Nuxt not working with sound","2023-08-31T13:56:56Z","https://github.com/vueuse/sound/issues/33",0.70009106,{"description":3187,"labels":3188,"number":3189,"owner":3138,"repository":3138,"state":3140,"title":3190,"updated_at":3191,"url":3192,"score":3193},"### Describe the bug\n\nLastly I tried to implement swipe gesture from example provided by the maintainer of Radix-Vue in my application and I had notice a weird behavior. [PR with swiping](https://github.com/unovue/radix-vue/pull/1467#issuecomment-2546369503)\r\n\r\nIt's like when you open devtools and emulating a mobile device and trying to use of the vueuse composable it doesn't work at all. What I mean, while you click in a device space and to try to reach out swipe action after moving the mouse past the edge of pointer boundaries, pointer lost focus and it's only occurs on chromium based browsers. I've checked it on Firefox for Devs, on Arc and on Safari. I didn't notice that issue on Firefox and Safari. Only on Chrome and Arc\r\n\r\nI discovered it because I forked whole usePointerSwipe composable into my app and debugging code. And only one thing which was interfering the action of the vueuse composable was pointer event itself, I changed it into mouse and touch events and they work fine.\r\n\r\nThere is the code block - I pass it in regular web pages and I notice the same behavior with the same flow, opening devtools and emulating a device.\r\n\r\n```ts\r\ndocument.addEventListener('pointerup', (e) => {\r\n console.log('Global pointerup event:', e)\r\n })\r\n\r\n document.addEventListener('pointerleave', (e) => {\r\n console.log('Pointer left document area')\r\n })\r\n\r\n document.addEventListener('pointermove', (e) => {\r\n console.log(`Pointer position: x=${e.clientX}, y=${e.clientY}`)\r\n\r\n\r\n const viewportWidth = document.documentElement.clientWidth\r\n const viewportHeight = document.documentElement.clientHeight\r\n\r\n console.log(`Viewport size: ${viewportWidth}x${viewportHeight}`)\r\n })\r\n\r\n document.addEventListener('pointerleave', (e) => {\r\n console.log('Pointer left document bounds!')\r\n console.log(`Last known position: x=${e.clientX}, y=${e.clientY}`)\r\n })\r\n ```\r\n \r\nTo clarify vueuse is only provider of the composable so it isn't provide that issue. The issue is with the pointer events and emulating a device in devtools in the chrome based browsers \r\n\r\nI'm providing reproduction below and I created issue on chromium https://issues.chromium.org/u/2/issues/386172192\r\n\n\n### Reproduction\n\nhttps://github.com/czarsbenemoriendi/usePointerSwipe\n\n### System Info\n\n```Shell\nSystem:\r\n OS: macOS 14.5\r\n CPU: (8) arm64 Apple M1 Pro\r\n Memory: 694.25 MB / 32.00 GB\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 20.14.0 - ~/.nvm/versions/node/v20.14.0/bin/node\r\n Yarn: 1.22.19 - /opt/homebrew/bin/yarn\r\n npm: 10.7.0 - ~/.nvm/versions/node/v20.14.0/bin/npm\r\n pnpm: 9.12.3 - ~/Library/pnpm/pnpm\r\n bun: 1.1.42 - /opt/homebrew/bin/bun\r\n Browsers:\r\n Chrome: 131.0.6778.205\r\n Safari: 17.5\r\n npmPackages:\r\n @vueuse/core: ^12.0.0 => 12.2.0\r\n vue: latest => 3.5.13\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Validations\n\n- [x] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://vueuse.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],4437,"BUG | `usePointerSwipe` | The browser handles pointer events strangely when emulating a mobile device in the DevTools","2025-01-24T13:22:53Z","https://github.com/vueuse/vueuse/issues/4437",0.70722455,{"description":3195,"labels":3196,"number":3197,"owner":3138,"repository":3138,"state":3198,"title":3199,"updated_at":3200,"url":3201,"score":3202},"### Describe the bug\r\n\r\nWhen using `useFocusWithin`, it will not take into account whether the document has focus or not, unlike :focus-within it tries to emulate.\r\n\r\nThis can be observed on vueuse's website; focusing an input on the demo page and moving focus out of the browser will cause the style to change, but the form will still be considered focused by vueuse.\r\n\r\n### Reproduction\r\n\r\nhttps://vueuse.org/core/useFocusWithin/\r\n\r\n### System Info\r\n\r\n```Shell\r\nSystem:\r\n OS: Linux 6.9 Arch Linux\r\n CPU: (8) x64 Intel(R) Core(TM) i7-7700K CPU @ 4.20GHz\r\n Memory: 2.20 GB / 15.58 GB\r\n Container: Yes\r\n Shell: 5.9 - /bin/zsh\r\n Binaries:\r\n Node: 22.1.0 - ~/.nvm/versions/node/v22.1.0/bin/node\r\n Yarn: 1.22.22 - /bin/yarn\r\n npm: 10.7.0 - ~/.nvm/versions/node/v22.1.0/bin/npm\r\n pnpm: 9.4.0 - ~/files/projects/radix-vue/radix-vue/node_modules/.bin/pnpm\r\n bun: 1.1.10 - /bin/bun\r\n Browsers:\r\n Chromium: 125.0.6422.112\r\n```\r\n\r\n\r\n### Used Package Manager\r\n\r\npnpm\r\n\r\n### Validations\r\n\r\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\r\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\r\n- [X] Read the [docs](https://vueuse.org/guide).\r\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\r\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\r\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\r\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],4083,"closed","useFocusWithin doesn't respond to document.hasFocus()","2024-12-19T03:23:00Z","https://github.com/vueuse/vueuse/issues/4083",0.67537713,{"description":3204,"labels":3205,"number":3206,"owner":3138,"repository":3138,"state":3198,"title":3207,"updated_at":3208,"url":3209,"score":3210},"### Describe the bug\n\n在正常的页面跳转中没有问题,但是一旦刷新页面就会报错,重复刷新两三次又能恢复正常一次\n\n### Reproduction\n\n无\n\n### System Info\n\n```Shell\n[Vue warn]: A plugin must either be a function or an object with an \"install\" function.\r\n[Vue Router warn]: uncaught error during route navigation:\r\nError [ERR_MODULE_NOT_FOUND]: Cannot find package 'vue-demi' imported from /root/mqingmo/server/node_modules/@vueuse/integrations/useQRCode.mjs\r\n at new NodeError (node:internal/errors:387:5)\r\n at packageResolve (node:internal/modules/esm/resolve:852:9)\r\n at moduleResolve (node:internal/modules/esm/resolve:901:20)\r\n at defaultResolve (node:internal/modules/esm/resolve:1115:11)\r\n at nextResolve (node:internal/modules/esm/loader:163:28)\r\n at ESMLoader.resolve (node:internal/modules/esm/loader:837:30)\r\n at ESMLoader.getModuleJob (node:internal/modules/esm/loader:424:18)\r\n at ModuleWrap.\u003Canonymous> (node:internal/modules/esm/module_job:76:40)\r\n at link (node:internal/modules/esm/module_job:75:36) {\r\n code: 'ERR_MODULE_NOT_FOUND'\r\n}\r\n```\n```\n\n\n### Used Package Manager\n\nnpm\n\n### Validations\n\n- [X] Follow our [Code of Conduct](https://github.com/vueuse/vueuse/blob/main/CODE_OF_CONDUCT.md)\n- [X] Read the [Contributing Guidelines](https://github.com/vueuse/vueuse/blob/main/CONTRIBUTING.md).\n- [X] Read the [docs](https://vueuse.org/guide).\n- [X] Check that there isn't [already an issue](https://github.com/vueuse/vueuse/issues) that reports the same bug to avoid creating a duplicate.\n- [X] Make sure this is a VueUse issue and not a framework-specific issue. For example, if it's a Vue SFC related bug, it should likely be reported to https://github.com/vuejs/core instead.\n- [X] Check that this is a concrete bug. For Q&A open a [GitHub Discussion](https://github.com/vueuse/vueuse/discussions).\n- [X] The provided reproduction is a [minimal reproducible example](https://stackoverflow.com/help/minimal-reproducible-example) of the bug.",[],3018,"nuxt3二维码在服务器上刷新页面异常","2023-06-23T10:19:09Z","https://github.com/vueuse/vueuse/issues/3018",0.6833751,{"description":3212,"labels":3213,"number":3214,"owner":3138,"repository":3139,"state":3198,"title":3215,"updated_at":3216,"url":3217,"score":3218},"I have the following compilation error when running `npm run build` in a fresh Vue app:\r\n\r\n```\r\nsrc/App.vue:21:26 - error TS7016: Could not find a declaration file for module '@vueuse/sound'. 'C:/[...redacted...]/node_modules/@vueuse/sound/dist/index.mjs' implicitly has an 'any' type.\r\n There are types at 'C:/[...redacted...]/node_modules/@vueuse/sound/dist/index.d.ts', but this result could not be resolved when respecting package.json \"exports\". The '@vueuse/sound' library may need to update its package.json or typings.\r\n\r\n21 import { useSound } from '@vueuse/sound';\r\n ~~~~~~~~~~~~~~~\r\n\r\n\r\nFound 1 error in src/App.vue:21\r\n\r\nERROR: \"type-check\" exited with 2.\r\n```\r\n\r\nThe error goes away if I manually delete the `exports` key in `package.json`:\r\n\r\n```json\r\n \"exports\": {\r\n \".\": {\r\n \"require\": \"./dist/index.cjs\",\r\n \"import\": \"./dist/index.mjs\"\r\n },\r\n \"./nuxt\": {\r\n \"require\": \"./dist/nuxt.cjs\",\r\n \"import\": \"./dist/nuxt.mjs\"\r\n }\r\n },\r\n```\r\n\r\nDo you have any clue to solve it?",[],42,"Could not find a declaration file for module '@vueuse/sound'","2024-12-28T16:04:51Z","https://github.com/vueuse/sound/issues/42",0.6847816,["Reactive",3220],{},["Set"],["ShallowReactive",3223],{"$fTRc1wZytZ_XrK4EfJfei_Sz-An4H4Yy6syhVxH_PVJc":-1,"$f58HMKYfdC5xu5IF60aaJa5Q91aUpyW3dGshP6u_fCy8":-1},"/vueuse/sound/50"]