From 0c54e607b7391cee504f0a234ebb4fb47fe64c06 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ya=C3=ABl=20Guilloux?= Date: Fri, 25 Nov 2022 03:22:10 +0100 Subject: [PATCH] chore(readme): add @vueuse/sound/nuxt docs --- README.md | 48 ++++++++++++++++++++++++++++++++++++++++++++++ src/nuxt/module.ts | 2 +- 2 files changed, 49 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index f4f459e..4287a1c 100644 --- a/README.md +++ b/README.md @@ -30,6 +30,54 @@ Or, use NPM: npm install @vueuse/sound ``` +## Nuxt + +If you use Nuxt 2, you must have [@nuxt/bridge](https://nuxtjs.org) setup in your project. + +Once you installed it, add `@vueuse/sound/nuxt` dependency to your project. + +Add `@vueuse/sound/nuxt` to the `modules` section of your `nuxt.config`: + +```js +// nuxt.config.js +defineNuxtConfig({ + modules: ['@vueuse/sound/nuxt'] +}) +``` + +Configure your sounds 🥁: + +```js +// nuxt.config.js +defineNuxtConfig({ + sound: { + sounds: { + back: { + src: "/back.wav", + options: { + volume: 0.25 + } + } + } + } +}) +``` + +You can also automatically scan an generate typings for your sounds in `public/sounds` directory by using **scan** feature: + +```js +// nuxt.config.js +defineNuxtConfig({ + sound: { + sounds: { + scan: true + } + } +}) +``` + +Then move your sounds into `public/sounds` directory, and get autocompletion on `useSound({url})`. + ## Examples ### Play a sound on click diff --git a/src/nuxt/module.ts b/src/nuxt/module.ts index bf0a4b8..ffd0cec 100644 --- a/src/nuxt/module.ts +++ b/src/nuxt/module.ts @@ -17,7 +17,7 @@ export interface ModuleOptions { scan: string | boolean /** - * An array of sounds to register. + * An object of sounds to register. * * The key will be used as an identifier for the sound to use as shortcut for `useSound(id)`. *