Installation

How to add nuxt-laravel-echo to your Nuxt application!

Install Nuxt module

You can use the following command to install the module and automatically register it in your nuxt.config.ts modules section

npx nuxi@latest module add nuxt-laravel-echo

Required configuration

Once you have the module installed and registered, provide the configuration in nuxt.config.ts to get started, according to your setup (see more details here - Laravel Broadcasting Client Setup)

nuxt.config.ts

export default defineNuxtConfig({
  //...

  echo: {
    key: 'REPLACE_ME', // Your Laravel Echo app key
    authentication: {
      baseUrl: 'laravel.test', // Your Laravel app URL
    },
  },
})

That's it! You can now use Nuxt Auth Sanctum in your Nuxt app ✨

Dev server

If you experience issues during the dev-server run, you should enable compatibility mode for the Pusher library by adding Vite configuration in your nuxt.config.ts like this:

nuxt.config.ts

export default defineNuxtConfig({
  vite: {
    optimizeDeps: {
      include: ['pusher-js'], // or ['nuxt-laravel-echo > pusher-js'] for newer Vite versions
    },
  },
})