├── docs ├── .npmrc ├── content │ ├── 1.getting-started │ │ ├── .navigation.yml │ │ ├── 2.installation.md │ │ └── 1.index.md │ ├── 3.composables │ │ ├── 2.useEchoConfig.md │ │ ├── 3.useEchoAppConfig.md │ │ └── 1.useEcho.md │ ├── 4.other │ │ ├── 3.breeze-nuxt-template.md │ │ ├── 2.interceptors.md │ │ └── 1.token-storage.md │ ├── 2.usage │ │ ├── 2.cookie.md │ │ ├── 3.token.md │ │ └── 1.config.md │ └── index.md ├── tsconfig.json ├── .env.example ├── eslint.config.mjs ├── pnpm-workspace.yaml ├── app │ ├── assets │ │ └── css │ │ │ └── main.css │ ├── components │ │ ├── AppLogo.vue │ │ ├── AppFooter.vue │ │ ├── AppHeader.vue │ │ ├── content │ │ │ ├── HeroBackground.vue │ │ │ └── StarsBackground.vue │ │ └── OgImage │ │ │ └── OgImageDocs.vue │ ├── layouts │ │ └── docs.vue │ ├── pages │ │ ├── index.vue │ │ └── [...slug].vue │ ├── error.vue │ ├── app.vue │ └── app.config.ts ├── renovate.json ├── .gitignore ├── content.config.ts ├── README.md ├── package.json ├── public │ └── logo.svg └── nuxt.config.ts ├── playground ├── tsconfig.json ├── server │ └── tsconfig.json ├── app.vue ├── layouts │ └── default.vue ├── nuxt.config.ts ├── package.json ├── error.vue ├── app.config.ts └── pages │ └── index.vue ├── src ├── runtime │ ├── server │ │ └── tsconfig.json │ ├── composables │ │ ├── useEchoAppConfig.ts │ │ ├── useEchoConfig.ts │ │ └── useEcho.ts │ ├── storages │ │ └── cookieTokenStorage.ts │ ├── interceptors │ │ ├── token.ts │ │ └── csrf.ts │ ├── types │ │ ├── config.ts │ │ └── options.ts │ ├── plugin.client.ts │ └── factories │ │ ├── http.ts │ │ └── echo.ts ├── templates.ts └── module.ts ├── test ├── fixtures │ └── basic │ │ ├── package.json │ │ ├── app.vue │ │ └── nuxt.config.ts └── basic.test.ts ├── tsconfig.json ├── .github ├── FUNDING.yml ├── dependabot.yml ├── ISSUE_TEMPLATE │ ├── custom.md │ ├── feature_request.md │ └── bug_report.md ├── pull_request_template.md └── workflows │ ├── ci.yml │ ├── docs.yml │ ├── release.yml │ └── prerelease.yml ├── .yamlfmt.yaml ├── .yamllint.yaml ├── SECURITY.md ├── eslint.config.mjs ├── .gitignore ├── LICENSE.md ├── CONTRIBUTING.md ├── package.json ├── README.md ├── CODE_OF_CONDUCT.md └── CHANGELOG.md /docs/.npmrc: -------------------------------------------------------------------------------- 1 | shamefully-hoist=true 2 | -------------------------------------------------------------------------------- /playground/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.nuxt/tsconfig.json" 3 | } 4 | -------------------------------------------------------------------------------- /playground/server/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../.nuxt/tsconfig.server.json" 3 | } -------------------------------------------------------------------------------- /docs/content/1.getting-started/.navigation.yml: -------------------------------------------------------------------------------- 1 | title: Getting Started 2 | icon: false 3 | -------------------------------------------------------------------------------- /src/runtime/server/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "../../../.nuxt/tsconfig.server.json", 3 | } -------------------------------------------------------------------------------- /test/fixtures/basic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "basic", 4 | "type": "module" 5 | } 6 | -------------------------------------------------------------------------------- /test/fixtures/basic/app.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 6 | -------------------------------------------------------------------------------- /docs/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | // https://nuxt.com/docs/guide/concepts/typescript 3 | "extends": "./.nuxt/tsconfig.json" 4 | } 5 | -------------------------------------------------------------------------------- /docs/.env.example: -------------------------------------------------------------------------------- 1 | # Public URL, used for OG Image when running nuxt generate 2 | NUXT_PUBLIC_SITE_URL=https://echo.manchenkoff.me 3 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.nuxt/tsconfig.json", 3 | "exclude": ["dist", "node_modules", "playground", "docs"] 4 | } 5 | -------------------------------------------------------------------------------- /.github/FUNDING.yml: -------------------------------------------------------------------------------- 1 | github: manchenkoff 2 | thanks_dev: manchenkoff 3 | buy_me_a_coffee: manchenkoff 4 | tidelift: npm/nuxt-laravel-echo 5 | -------------------------------------------------------------------------------- /playground/app.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 8 | -------------------------------------------------------------------------------- /.yamlfmt.yaml: -------------------------------------------------------------------------------- 1 | # https://github.com/google/yamlfmt/blob/main/docs/config-file.md 2 | formatter: 3 | type: basic 4 | include_document_start: false 5 | -------------------------------------------------------------------------------- /.github/dependabot.yml: -------------------------------------------------------------------------------- 1 | version: 2 2 | updates: 3 | - package-ecosystem: "npm" 4 | directory: "/" 5 | schedule: 6 | interval: "monthly" 7 | -------------------------------------------------------------------------------- /test/fixtures/basic/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | import MyModule from '../../../src/module' 2 | 3 | export default defineNuxtConfig({ 4 | modules: [MyModule], 5 | }) 6 | -------------------------------------------------------------------------------- /docs/eslint.config.mjs: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | import withNuxt from './.nuxt/eslint.config.mjs' 3 | 4 | export default withNuxt( 5 | // Your custom configs here 6 | ) 7 | -------------------------------------------------------------------------------- /.yamllint.yaml: -------------------------------------------------------------------------------- 1 | # https://yamllint.readthedocs.io/en/stable/rules.html 2 | extends: default 3 | rules: 4 | document-start: 5 | present: false 6 | truthy: false 7 | -------------------------------------------------------------------------------- /docs/pnpm-workspace.yaml: -------------------------------------------------------------------------------- 1 | ignoredBuiltDependencies: 2 | - '@parcel/watcher' 3 | - '@tailwindcss/oxide' 4 | - esbuild 5 | - unrs-resolver 6 | - vue-demi 7 | 8 | onlyBuiltDependencies: 9 | - better-sqlite3 10 | - sharp 11 | -------------------------------------------------------------------------------- /playground/layouts/default.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 10 | 11 | 12 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/custom.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Question 3 | about: Choose this template if you have a question about the project or functionality 4 | title: "[Question] Short description" 5 | labels: investigate, question 6 | assignees: manchenkoff 7 | --- 8 | -------------------------------------------------------------------------------- /src/runtime/composables/useEchoAppConfig.ts: -------------------------------------------------------------------------------- 1 | import type { EchoAppConfig } from '../types/config' 2 | import { useAppConfig } from '#app' 3 | 4 | export const useEchoAppConfig = (): EchoAppConfig => { 5 | return (useAppConfig().echo ?? {}) as EchoAppConfig 6 | } 7 | -------------------------------------------------------------------------------- /playground/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | export default defineNuxtConfig({ 2 | modules: ['../src/module'], 3 | devtools: { enabled: true }, 4 | compatibilityDate: '2024-07-03', 5 | 6 | echo: { 7 | key: '9iaau1cgc7iqdt6ee97m', 8 | scheme: 'http', 9 | }, 10 | }) 11 | -------------------------------------------------------------------------------- /src/runtime/composables/useEchoConfig.ts: -------------------------------------------------------------------------------- 1 | import type { ModuleOptions } from '../types/options' 2 | import { useRuntimeConfig } from '#imports' 3 | 4 | export const useEchoConfig = (): ModuleOptions => { 5 | return useRuntimeConfig().public.echo as ModuleOptions 6 | } 7 | -------------------------------------------------------------------------------- /.github/pull_request_template.md: -------------------------------------------------------------------------------- 1 | **Is your PR related to a specific issue/feature? Please describe and mention issues.** 2 | 3 | A clear and concise description of what was fixed or implemented. 4 | 5 | **Additional context** 6 | 7 | Add any other context or screenshots about the feature request here. 8 | -------------------------------------------------------------------------------- /docs/app/assets/css/main.css: -------------------------------------------------------------------------------- 1 | @import "tailwindcss"; 2 | @import "@nuxt/ui"; 3 | 4 | @source "../../../content/**/*"; 5 | 6 | @theme static { 7 | --container-8xl: 90rem; 8 | --font-sans: 'Public Sans', sans-serif; 9 | } 10 | 11 | :root { 12 | --ui-container: var(--container-8xl); 13 | } 14 | -------------------------------------------------------------------------------- /playground/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "nuxt-laravel-echo-playground", 4 | "type": "module", 5 | "scripts": { 6 | "dev": "nuxi dev", 7 | "build": "nuxi build", 8 | "generate": "nuxi generate" 9 | }, 10 | "dependencies": { 11 | "nuxt": "^3.12.3" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /docs/renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": ["github>nuxt/renovate-config-nuxt"], 3 | "lockFileMaintenance": { 4 | "enabled": true 5 | }, 6 | "packageRules": [ 7 | { 8 | "matchDepTypes": ["resolutions"], 9 | "enabled": false 10 | } 11 | ], 12 | "postUpdateOptions": ["pnpmDedupe"] 13 | } 14 | -------------------------------------------------------------------------------- /src/runtime/composables/useEcho.ts: -------------------------------------------------------------------------------- 1 | import type Echo from 'laravel-echo' 2 | import type { BroadcastDriver } from 'laravel-echo' 3 | import { useNuxtApp } from '#app' 4 | 5 | export const useEcho = (): Echo => { 6 | const { $echo } = useNuxtApp() 7 | 8 | return $echo as Echo 9 | } 10 | -------------------------------------------------------------------------------- /docs/.gitignore: -------------------------------------------------------------------------------- 1 | # Nuxt dev/build outputs 2 | .output 3 | .data 4 | .nuxt 5 | .nitro 6 | .cache 7 | dist 8 | 9 | # Node dependencies 10 | node_modules 11 | 12 | # Logs 13 | logs 14 | *.log 15 | 16 | # Misc 17 | .DS_Store 18 | .fleet 19 | .idea 20 | 21 | # Local env files 22 | .env 23 | .env.* 24 | !.env.example 25 | 26 | # VSC 27 | .history 28 | -------------------------------------------------------------------------------- /SECURITY.md: -------------------------------------------------------------------------------- 1 | # Security Policy 2 | 3 | ## Supported Versions 4 | 5 | | Version | Supported | 6 | | -------- | ------------------ | 7 | | >= 0.0.1 | :white_check_mark: | 8 | | <= 0.0.1 | :x: | 9 | 10 | ## Reporting a Vulnerability 11 | 12 | If you find a vulnerability, please get in touch with me via artem@manchenkoff.me or by opening a new issue in the repository. 13 | 14 | Usually, I respond in a few days but sometimes it might take a bit more. 15 | -------------------------------------------------------------------------------- /docs/app/components/AppLogo.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 18 | 19 | 20 | -------------------------------------------------------------------------------- /test/basic.test.ts: -------------------------------------------------------------------------------- 1 | import { fileURLToPath } from 'node:url' 2 | import { describe, it, expect } from 'vitest' 3 | import { setup, $fetch } from '@nuxt/test-utils/e2e' 4 | 5 | describe('ssr', async () => { 6 | await setup({ 7 | rootDir: fileURLToPath(new URL('./fixtures/basic', import.meta.url)), 8 | }) 9 | 10 | it('renders the index page', async () => { 11 | // Get response to a server-rendered page with `$fetch`. 12 | const html = await $fetch('/') 13 | expect(html).toContain('
basic
') 14 | }) 15 | }) 16 | -------------------------------------------------------------------------------- /playground/error.vue: -------------------------------------------------------------------------------- 1 | 15 | 16 | 25 | 26 | 27 | -------------------------------------------------------------------------------- /docs/app/layouts/docs.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 23 | -------------------------------------------------------------------------------- /playground/app.config.ts: -------------------------------------------------------------------------------- 1 | import type { NuxtApp } from '#app' 2 | import type { FetchContext } from 'ofetch' 3 | import type { ConsolaInstance } from 'consola' 4 | 5 | export default defineAppConfig({ 6 | echo: { 7 | interceptors: { 8 | async onRequest( 9 | _app: NuxtApp, 10 | ctx: FetchContext, 11 | logger: ConsolaInstance 12 | ): Promise { 13 | const tenant = 'random-string' 14 | 15 | ctx.options.headers.set('X-Echo-Tenant', tenant) 16 | logger.debug('Updated tenant header', tenant) 17 | } 18 | }, 19 | } 20 | }) 21 | -------------------------------------------------------------------------------- /eslint.config.mjs: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | import { createConfigForNuxt } from '@nuxt/eslint-config/flat' 3 | 4 | export default createConfigForNuxt( 5 | { 6 | features: { 7 | tooling: true, 8 | stylistic: true, 9 | }, 10 | dirs: { 11 | src: ['./playground'], 12 | }, 13 | }, 14 | // 15 | { 16 | rules: { 17 | '@stylistic/comma-dangle': 'off', 18 | '@stylistic/indent': 'off', 19 | 'vue/no-multiple-template-root': 'off', 20 | 'vue/multi-word-component-names': 'off', 21 | }, 22 | }, 23 | // 24 | { 25 | ignores: ['docs/'], 26 | }, 27 | ) 28 | -------------------------------------------------------------------------------- /docs/app/components/AppFooter.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 24 | -------------------------------------------------------------------------------- /docs/content/3.composables/2.useEchoConfig.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: useEchoConfig 3 | description: Accessing the current Echo configuration from your Nuxt app. 4 | navigation: 5 | icon: i-lucide-parentheses 6 | --- 7 | 8 | ## Usage 9 | 10 | This composable provides quick access to Nuxt configuration under the `echo` key. 11 | It is used as a part of the module implementation, so there is no particular need to use this in your application. 12 | 13 | ## Code sample 14 | 15 | Here is an example of the call: 16 | 17 | ```typescript [SomeService.ts] 18 | const echoConfig = useEchoConfig() 19 | 20 | console.log(echoConfig.host) // print the broadcasting host URL 21 | ``` 22 | 23 | -------------------------------------------------------------------------------- /docs/content.config.ts: -------------------------------------------------------------------------------- 1 | import { defineContentConfig, defineCollection, z } from '@nuxt/content' 2 | 3 | export default defineContentConfig({ 4 | collections: { 5 | landing: defineCollection({ 6 | type: 'page', 7 | source: 'index.md' 8 | }), 9 | docs: defineCollection({ 10 | type: 'page', 11 | source: { 12 | include: '**', 13 | exclude: ['index.md'] 14 | }, 15 | schema: z.object({ 16 | links: z.array(z.object({ 17 | label: z.string(), 18 | icon: z.string(), 19 | to: z.string(), 20 | target: z.string().optional() 21 | })).optional() 22 | }) 23 | }) 24 | } 25 | }) 26 | -------------------------------------------------------------------------------- /docs/content/3.composables/3.useEchoAppConfig.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: useEchoAppConfig 3 | description: Accessing the bundled Echo configuration from your Nuxt app. 4 | navigation: 5 | icon: i-lucide-parentheses 6 | --- 7 | 8 | ## Usage 9 | 10 | This composable provides quick access to app configuration under the `echo` key instead of calling `useAppConfig().echo`. 11 | It is used as a part of the module implementation, so there is no particular need to use this in your application. 12 | 13 | ## Code sample 14 | 15 | Here is an example of the call: 16 | 17 | ```typescript [SomeService.ts] 18 | const echoAppConfig = useEchoAppConfig() 19 | 20 | // sets the Bearer token value to the storage 21 | echoConfig.tokenStorage.set('auth_token_value') 22 | ``` 23 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/feature_request.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Feature request 3 | about: Suggest an idea for this project 4 | title: "[Feature] Short description" 5 | labels: enhancement 6 | assignees: manchenkoff 7 | --- 8 | 9 | **Is your feature request related to a problem? Please describe.** 10 | 11 | A clear and concise description of what the problem is. Ex. I'm always frustrated when [...] 12 | 13 | **Describe the solution you'd like** 14 | 15 | A clear and concise description of what you want to happen. 16 | 17 | **Describe alternatives you've considered** 18 | 19 | A clear and concise description of any alternative solutions or features you've considered. 20 | 21 | **Additional context** 22 | 23 | Add any other context or screenshots about the feature request here. 24 | -------------------------------------------------------------------------------- /src/templates.ts: -------------------------------------------------------------------------------- 1 | import { addTypeTemplate } from '@nuxt/kit' 2 | import type { Resolver } from '@nuxt/kit' 3 | 4 | /** 5 | * Defines module's type augmentation for Nuxt build 6 | * @param resolver 7 | */ 8 | export const registerTypeTemplates = (resolver: Resolver) => { 9 | addTypeTemplate({ 10 | filename: 'types/echo.d.ts', 11 | getContents: () => `// Generated by nuxt-laravel-echo module 12 | import type { EchoAppConfig } from '${resolver.resolve('./runtime/types/config.ts')}'; 13 | 14 | declare module 'nuxt/schema' { 15 | interface AppConfig { 16 | echo?: EchoAppConfig; 17 | } 18 | } 19 | 20 | declare module '@nuxt/schema' { 21 | interface AppConfigInput { 22 | echo?: EchoAppConfig; 23 | } 24 | } 25 | 26 | export {};`, 27 | }) 28 | } 29 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Dependencies 2 | node_modules 3 | 4 | # Logs 5 | *.log* 6 | 7 | # Temp directories 8 | .temp 9 | .tmp 10 | .cache 11 | 12 | # Yarn 13 | **/.yarn/cache 14 | **/.yarn/*state* 15 | 16 | # Generated dirs 17 | dist 18 | 19 | # Nuxt 20 | .nuxt 21 | .output 22 | .data 23 | .vercel_build_output 24 | .build-* 25 | .netlify 26 | 27 | # Env 28 | .env 29 | 30 | # Testing 31 | reports 32 | coverage 33 | *.lcov 34 | .nyc_output 35 | 36 | # VSCode 37 | .vscode/* 38 | !.vscode/settings.json 39 | !.vscode/tasks.json 40 | !.vscode/launch.json 41 | !.vscode/extensions.json 42 | !.vscode/*.code-snippets 43 | 44 | # Intellij idea 45 | *.iml 46 | .idea 47 | 48 | # OSX 49 | .DS_Store 50 | .AppleDouble 51 | .LSOverride 52 | .AppleDB 53 | .AppleDesktop 54 | Network Trash Folder 55 | Temporary Items 56 | .apdisk 57 | -------------------------------------------------------------------------------- /docs/app/pages/index.vue: -------------------------------------------------------------------------------- 1 | 26 | 27 | 34 | -------------------------------------------------------------------------------- /src/runtime/storages/cookieTokenStorage.ts: -------------------------------------------------------------------------------- 1 | import { unref } from 'vue' 2 | import type { TokenStorage } from '../types/config' 3 | import { useCookie } from '#app' 4 | import type { NuxtApp } from '#app' 5 | 6 | const cookieTokenKey = 'sanctum.token.cookie' 7 | 8 | /** 9 | * Token storage using a secure cookie. 10 | * Works with both CSR/SSR modes. 11 | */ 12 | export const cookieTokenStorage: TokenStorage = { 13 | async get(app: NuxtApp) { 14 | return app.runWithContext(() => { 15 | const cookie = useCookie(cookieTokenKey, { readonly: true }) 16 | return unref(cookie.value) ?? undefined 17 | }) 18 | }, 19 | 20 | async set(app: NuxtApp, token?: string) { 21 | await app.runWithContext(() => { 22 | const cookie = useCookie(cookieTokenKey, { secure: true }) 23 | cookie.value = token 24 | }) 25 | }, 26 | } 27 | -------------------------------------------------------------------------------- /docs/README.md: -------------------------------------------------------------------------------- 1 | # Nuxt - Laravel Echo Docs 2 | 3 | This directory contains Nuxt Content project to deploy 4 | module documentation to Github Pages. 5 | 6 | ## Setup 7 | 8 | Make sure to install the dependencies: 9 | 10 | ```bash 11 | pnpm install 12 | ``` 13 | 14 | ## Development Server 15 | 16 | Start the development server on `http://localhost:3000`: 17 | 18 | ```bash 19 | pnpm dev 20 | ``` 21 | 22 | ## Production 23 | 24 | Build the application for production: 25 | 26 | ```bash 27 | pnpm build 28 | ``` 29 | 30 | Or generate all pages for static hosting via: 31 | 32 | ```bash 33 | pnpm generate 34 | ``` 35 | 36 | Locally preview production build: 37 | 38 | ```bash 39 | pnpm preview 40 | ``` 41 | 42 | ## Validation 43 | 44 | To check code quality, run the following command: 45 | 46 | ```bash 47 | pnpm validate 48 | ``` 49 | 50 | or separately: 51 | 52 | ```bash 53 | pnpm lint 54 | pnpm typecheck 55 | ``` 56 | -------------------------------------------------------------------------------- /docs/app/error.vue: -------------------------------------------------------------------------------- 1 | 29 | 30 | 46 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | MIT License 2 | 3 | Copyright (c) 2024 Artem Manchenkov 4 | 5 | Permission is hereby granted, free of charge, to any person obtaining a copy 6 | of this software and associated documentation files (the "Software"), to deal 7 | in the Software without restriction, including without limitation the rights 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell 9 | copies of the Software, and to permit persons to whom the Software is 10 | furnished to do so, subject to the following conditions: 11 | 12 | The above copyright notice and this permission notice shall be included in all 13 | copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR 16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, 17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE 18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER 19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, 20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE 21 | SOFTWARE. 22 | -------------------------------------------------------------------------------- /docs/app/app.vue: -------------------------------------------------------------------------------- 1 | 30 | 31 | 53 | -------------------------------------------------------------------------------- /docs/content/4.other/3.breeze-nuxt-template.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Breeze Nuxt Template 3 | description: A quick introduction to the application template based on Nuxt for the Laravel Sanctum API backend. 4 | navigation: 5 | icon: i-simple-icons-nuxt 6 | --- 7 | 8 | ## Application template 9 | 10 | Suppose you want to start a fresh project based on Nuxt and Laravel Sanctum with Laravel Echo integration. 11 | 12 | In that case, you may consider trying out the template repository that 13 | has implemented Echo integration and all authentication logic and also contains several pages such as: 14 | 15 | - Landing 16 | - Login 17 | - Sign up 18 | - Password reset 19 | - Dashboard 20 | 21 | The repository is available here - [breeze-nuxt](https://github.com/manchenkoff/breeze-nuxt), 22 | follow the guide in the `readme.md` file to set up Laravel API and connect it to the front-end application. 23 | 24 | Also, it uses the Nuxt UI module that allows you to start building complex interfaces with ease thanks to predefined components and Tailwind CSS. For more details, check the repository. 25 | 26 | As for the backend API part, we also have you covered. 27 | Check out our [breeze-api](https://github.com/manchenkoff/breeze-api) template. 28 | 29 | -------------------------------------------------------------------------------- /docs/app/components/AppHeader.vue: -------------------------------------------------------------------------------- 1 | 8 | 9 | 49 | -------------------------------------------------------------------------------- /src/runtime/interceptors/token.ts: -------------------------------------------------------------------------------- 1 | import type { FetchContext } from 'ofetch' 2 | import type { ConsolaInstance } from 'consola' 3 | import type { ModuleOptions } from '../types/options' 4 | import { useEchoAppConfig } from '../composables/useEchoAppConfig' 5 | import { createError } from '#app' 6 | import type { NuxtApp } from '#app' 7 | 8 | /** 9 | * Sets Authorization header for the request if the token is present. 10 | * @param app Nuxt application instance 11 | * @param ctx Fetch context 12 | * @param logger Module logger instance 13 | */ 14 | export default async function handleAuthToken( 15 | app: NuxtApp, 16 | ctx: FetchContext, 17 | logger: ConsolaInstance, 18 | ): Promise { 19 | const config = app.$config.public.echo as ModuleOptions 20 | 21 | if (config.authentication?.mode !== 'token') { 22 | return 23 | } 24 | 25 | const { tokenStorage } = useEchoAppConfig() 26 | 27 | if (!tokenStorage) { 28 | throw createError('Token storage is not defined') 29 | } 30 | 31 | const token = await tokenStorage.get(app) 32 | 33 | if (!token) { 34 | logger.debug('Authorization token is missing, unable to set header') 35 | return 36 | } 37 | 38 | ctx.options.headers.set('Authorization', `Bearer ${token}`) 39 | } 40 | -------------------------------------------------------------------------------- /docs/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nuxt-laravel-echo-docs", 3 | "private": true, 4 | "type": "module", 5 | "scripts": { 6 | "build": "nuxt build", 7 | "generate": "nuxt generate", 8 | "dev": "nuxt dev", 9 | "preview": "nuxt preview", 10 | "postinstall": "nuxt prepare", 11 | "lint": "eslint .", 12 | "lint:fix": "eslint . --fix", 13 | "typecheck": "nuxt typecheck", 14 | "validate": "pnpm lint && pnpm typecheck" 15 | }, 16 | "dependencies": { 17 | "@iconify-json/lucide": "^1.2.68", 18 | "@iconify-json/simple-icons": "^1.2.54", 19 | "@iconify-json/vscode-icons": "^1.2.30", 20 | "@nuxt/content": "^3.7.1", 21 | "@nuxt/image": "^1.11.0", 22 | "@nuxt/ui": "^4.0.1", 23 | "better-sqlite3": "^12.4.1", 24 | "nuxt": "^4.1.2", 25 | "nuxt-llms": "0.1.3", 26 | "nuxt-og-image": "^5.1.11" 27 | }, 28 | "devDependencies": { 29 | "@nuxt/eslint": "^1.9.0", 30 | "eslint": "^9.37.0", 31 | "typescript": "^5.9.3", 32 | "vue-tsc": "^3.1.0" 33 | }, 34 | "resolutions": { 35 | "unimport": "4.1.1" 36 | }, 37 | "packageManager": "pnpm@10.18.0+sha512.e804f889f1cecc40d572db084eec3e4881739f8dec69c0ff10d2d1beff9a4e309383ba27b5b750059d7f4c149535b6cd0d2cb1ed3aeb739239a4284a68f40cfa" 38 | } 39 | -------------------------------------------------------------------------------- /.github/ISSUE_TEMPLATE/bug_report.md: -------------------------------------------------------------------------------- 1 | --- 2 | name: Bug report 3 | about: Create a report for a bug or incorrect behavior of the project 4 | title: "[Bug] Short description" 5 | labels: bug 6 | assignees: manchenkoff 7 | --- 8 | 9 | **Describe the bug** 10 | 11 | A clear and concise description of what the bug is. 12 | 13 | **To Reproduce** 14 | 15 | Steps to reproduce the behavior: 16 | 17 | 1. Go to '...' 18 | 2. Click on '....' 19 | 3. See error 20 | 21 | **Expected behavior** 22 | 23 | A clear and concise description of what you expected to happen. 24 | 25 | **Screenshots** 26 | 27 | If applicable, add screenshots to help explain your problem. 28 | 29 | **Module information** 30 | 31 | - Version: 32 | - Complete configuration of `echo` from your `nuxt.config.ts` 33 | 34 | ```typescript 35 | export default defineNuxtConfig({ 36 | modules: ["nuxt-laravel-echo"], 37 | 38 | echo: { 39 | baseUrl: "http://localhost:80", 40 | }, 41 | }); 42 | ``` 43 | 44 | **Nuxt environment:** 45 | 46 | - Version: 47 | - SSR Enabled: 48 | - Environment: 49 | 50 | **Additional context** 51 | 52 | Add any other context about the problem here. For instance, you can attach the details about the request/response of the application or logs from the backend to make this problem easier to understand. 53 | -------------------------------------------------------------------------------- /.github/workflows/ci.yml: -------------------------------------------------------------------------------- 1 | name: Nuxt [Validate] 2 | env: 3 | node_version: 20 4 | concurrency: 5 | group: nuxt-laravel-echo-ci 6 | cancel-in-progress: false 7 | on: 8 | workflow_dispatch: 9 | pull_request: 10 | branches: [main] 11 | permissions: 12 | contents: read 13 | jobs: 14 | lint: 15 | runs-on: ubuntu-latest 16 | steps: 17 | - name: Checkout 18 | uses: actions/checkout@v4 19 | - name: Setup Node.js 20 | uses: actions/setup-node@v4 21 | with: 22 | node-version: ${{ env.node_version }} 23 | - name: Enable corepack 24 | run: corepack enable 25 | - name: Install dependencies 26 | run: npx nypm@latest i 27 | - name: Build stubs 28 | run: pnpm dev:prepare 29 | - name: Lint 30 | run: pnpm lint 31 | - name: Type check 32 | run: pnpm test:types 33 | test: 34 | runs-on: ubuntu-latest 35 | steps: 36 | - name: Checkout 37 | uses: actions/checkout@v4 38 | - name: Setup Node.js 39 | uses: actions/setup-node@v4 40 | with: 41 | node-version: ${{ env.node_version }} 42 | - name: Enable corepack 43 | run: corepack enable 44 | - name: Install dependencies 45 | run: npx nypm@latest i 46 | - name: Build stubs 47 | run: pnpm dev:prepare 48 | - name: Test 49 | run: pnpm test 50 | -------------------------------------------------------------------------------- /.github/workflows/docs.yml: -------------------------------------------------------------------------------- 1 | name: Nuxt [Docs] 2 | env: 3 | node_version: 20 4 | concurrency: 5 | group: "pages" 6 | cancel-in-progress: false 7 | on: 8 | push: 9 | branches: ["main"] 10 | paths: ["docs/**"] 11 | workflow_dispatch: 12 | permissions: 13 | contents: read 14 | pages: write 15 | id-token: write 16 | jobs: 17 | build: 18 | runs-on: ubuntu-latest 19 | steps: 20 | - name: Checkout 21 | uses: actions/checkout@v4 22 | - name: Setup Node.js 23 | uses: actions/setup-node@v4 24 | with: 25 | node-version: ${{ env.node_version }} 26 | - name: Enable corepack 27 | run: corepack enable 28 | - name: Install dependencies 29 | working-directory: ./docs 30 | run: npx nypm@latest i 31 | - name: Validate 32 | working-directory: ./docs 33 | run: pnpm validate 34 | - name: Generate documentation 35 | run: pnpm generate 36 | working-directory: ./docs 37 | - name: Upload artifact 38 | uses: actions/upload-pages-artifact@v3 39 | with: 40 | path: ./docs/.output/public 41 | deploy: 42 | environment: 43 | name: github-pages 44 | url: ${{ steps.deployment.outputs.page_url }} 45 | runs-on: ubuntu-latest 46 | needs: build 47 | steps: 48 | - name: Deploy to GitHub Pages 49 | id: deployment 50 | uses: actions/deploy-pages@v4 51 | -------------------------------------------------------------------------------- /src/runtime/types/config.ts: -------------------------------------------------------------------------------- 1 | import type { FetchContext } from 'ofetch' 2 | import type { ConsolaInstance } from 'consola' 3 | import type { NuxtApp } from '#app' 4 | 5 | /** 6 | * Handlers to work with authentication token. 7 | */ 8 | export interface TokenStorage { 9 | /** 10 | * Function to load a token from the storage. 11 | */ 12 | get: (app: NuxtApp) => Promise 13 | /** 14 | * Function to save a token to the storage. 15 | */ 16 | set: (app: NuxtApp, token?: string) => Promise 17 | } 18 | 19 | /** 20 | * Request interceptor. 21 | */ 22 | export type EchoInterceptor = ( 23 | app: NuxtApp, 24 | ctx: FetchContext, 25 | logger: ConsolaInstance 26 | ) => Promise 27 | 28 | /** 29 | * Interceptors to be used by the ofetch client. 30 | */ 31 | export interface EchoInterceptors { 32 | /** 33 | * Function to execute before sending a request. 34 | */ 35 | onRequest?: EchoInterceptor 36 | /** 37 | * Function to execute after receiving a response. 38 | */ 39 | onResponse?: EchoInterceptor 40 | } 41 | 42 | /** 43 | * Echo configuration for the application side with user-defined handlers. 44 | */ 45 | export interface EchoAppConfig { 46 | /** 47 | * Token storage handlers to be used by the client. 48 | */ 49 | tokenStorage?: TokenStorage 50 | /** 51 | * Request interceptors to be used by the client. 52 | */ 53 | interceptors?: EchoInterceptors 54 | } 55 | -------------------------------------------------------------------------------- /docs/content/2.usage/2.cookie.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Cookie authentication 3 | description: How to setup Sanctum cookie-based authentication for Laravel Echo. 4 | 5 | navigation: 6 | icon: i-lucide-cookie 7 | --- 8 | 9 | ## Configuration 10 | 11 | By default, the module provides configuration to integrate seamlessly with Laravel Sanctum authentication based on the XSRF token. 12 | 13 | To explicitly set this authentication mode, update `echo.authentication.mode` configuration property to `cookie`. 14 | 15 | ::tip 16 | --- 17 | to: https://laravel.com/docs/12.x/sanctum#authorizing-private-broadcast-channels 18 | target: _blank 19 | --- 20 | You can check the official Laravel documentation here - **Authorizing Private Channels**. 21 | :: 22 | 23 | ::warning 24 | Nuxt and Laravel applications must share the same top-level domain. For instance: 25 | - Nuxt application - `domain.com` 26 | - Laravel application - `api.domain.com` 27 | :: 28 | 29 | ## How it works 30 | 31 | You should already have an authenticated user by submitting credentials to your login endpoint, 32 | for instance, using the [Nuxt Auth Sanctum](https://sanctum.manchenkoff.me) module. 33 | 34 | Once the module has an authentication state, it will request a CSRF cookie from the API, 35 | and pass it as an XSRF header to each Echo channel authorization request to confirm the current user identity. 36 | 37 | ::callout 38 | Ensure that you use `cookie` mode for `nuxt-auth-sanctum` module 39 | to save the CSRF cookie from the API response on authentication requests. 40 | :: 41 | -------------------------------------------------------------------------------- /playground/pages/index.vue: -------------------------------------------------------------------------------- 1 | 35 | 36 | 60 | 61 | 62 | -------------------------------------------------------------------------------- /src/module.ts: -------------------------------------------------------------------------------- 1 | import { 2 | defineNuxtModule, 3 | addPlugin, 4 | createResolver, 5 | useLogger, 6 | addImportsDir, 7 | } from '@nuxt/kit' 8 | import { defu } from 'defu' 9 | import type { ModuleOptions } from './runtime/types/options' 10 | import { registerTypeTemplates } from './templates' 11 | 12 | const MODULE_NAME = 'nuxt-laravel-echo' 13 | 14 | export type ModulePublicRuntimeConfig = { echo: ModuleOptions } 15 | 16 | const defaultModuleOptions: ModuleOptions = { 17 | broadcaster: 'reverb', 18 | host: 'localhost', 19 | port: 8080, 20 | scheme: 'https', 21 | transports: ['ws', 'wss'], 22 | authentication: { 23 | mode: 'cookie', 24 | baseUrl: 'http://localhost:80', 25 | authEndpoint: '/broadcasting/auth', 26 | csrfEndpoint: '/sanctum/csrf-cookie', 27 | csrfCookie: 'XSRF-TOKEN', 28 | csrfHeader: 'X-XSRF-TOKEN', 29 | }, 30 | logLevel: 3, 31 | } 32 | 33 | export default defineNuxtModule({ 34 | meta: { 35 | name: MODULE_NAME, 36 | configKey: 'echo', 37 | }, 38 | defaults: defaultModuleOptions, 39 | setup(_options, _nuxt) { 40 | const resolver = createResolver(import.meta.url) 41 | const logger = useLogger(MODULE_NAME, { level: _options.logLevel }) 42 | 43 | _nuxt.options.build.transpile.push(resolver.resolve('./runtime')) 44 | _nuxt.options.runtimeConfig.public.echo = defu( 45 | _nuxt.options.runtimeConfig.public.echo, 46 | _options 47 | ) 48 | 49 | addPlugin(resolver.resolve('./runtime/plugin.client')) 50 | addImportsDir(resolver.resolve('./runtime/composables')) 51 | 52 | registerTypeTemplates(resolver) 53 | 54 | logger.info('Laravel Echo module initialized!') 55 | }, 56 | }) 57 | -------------------------------------------------------------------------------- /src/runtime/interceptors/csrf.ts: -------------------------------------------------------------------------------- 1 | import type { FetchContext } from 'ofetch' 2 | import type { ConsolaInstance } from 'consola' 3 | import type { ModuleOptions } from '../types/options' 4 | import type { NuxtApp } from '#app' 5 | import { useCookie } from '#app' 6 | 7 | const readCsrfCookie = (name: string) => useCookie(name, { readonly: true }) 8 | 9 | /** 10 | * Sets the CSRF token header for the request if the CSRF cookie is present. 11 | * @param app Nuxt application instance 12 | * @param ctx Fetch context 13 | * @param logger Module logger instance 14 | */ 15 | export default async function handleCsrfCookie( 16 | app: NuxtApp, 17 | ctx: FetchContext, 18 | logger: ConsolaInstance, 19 | ): Promise { 20 | const config = app.$config.public.echo as ModuleOptions 21 | 22 | if (config.authentication?.mode !== 'cookie') { 23 | return 24 | } 25 | 26 | const { authentication } = config 27 | 28 | if (authentication.csrfCookie === undefined) { 29 | throw new Error(`'echo.authentication.csrfCookie' is not defined`) 30 | } 31 | 32 | let csrfToken = readCsrfCookie(authentication.csrfCookie) 33 | 34 | if (!csrfToken.value) { 35 | if (authentication.csrfEndpoint === undefined) { 36 | throw new Error(`'echo.authentication.csrfCookie' is not defined`) 37 | } 38 | 39 | await $fetch(authentication.csrfEndpoint, { 40 | baseURL: authentication.baseUrl, 41 | credentials: 'include', 42 | retry: false, 43 | }) 44 | 45 | csrfToken = readCsrfCookie(authentication.csrfCookie) 46 | } 47 | 48 | if (!csrfToken.value) { 49 | logger.warn(`${authentication.csrfCookie} cookie is missing, unable to set ${authentication.csrfHeader} header`) 50 | return 51 | } 52 | 53 | if (authentication.csrfHeader === undefined) { 54 | throw new Error(`'echo.authentication.csrfHeader' is not defined`) 55 | } 56 | 57 | ctx.options.headers.set(authentication.csrfHeader, csrfToken.value) 58 | } 59 | -------------------------------------------------------------------------------- /.github/workflows/release.yml: -------------------------------------------------------------------------------- 1 | name: Nuxt [Release] 2 | env: 3 | node_version: 20 4 | changelog_user: Github CI 5 | changelog_email: artem@manchenkoff.me 6 | NODE_AUTH_TOKEN: ${{ secrets.npm_token }} 7 | NODE_REGISTRY: https://registry.npmjs.org/ 8 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 9 | concurrency: 10 | group: nuxt-laravel-echo-release 11 | cancel-in-progress: false 12 | permissions: 13 | contents: write 14 | id-token: write 15 | on: workflow_dispatch 16 | jobs: 17 | lint: 18 | runs-on: ubuntu-latest 19 | steps: 20 | - name: Checkout 21 | uses: actions/checkout@v4 22 | - name: Setup Node.js 23 | uses: actions/setup-node@v4 24 | with: 25 | node-version: ${{ env.node_version }} 26 | - name: Enable corepack 27 | run: corepack enable 28 | - name: Install dependencies 29 | run: npx nypm@latest i 30 | - name: Prepare stubs 31 | run: pnpm dev:prepare 32 | - name: Validate package 33 | run: pnpm validate 34 | publish: 35 | runs-on: ubuntu-latest 36 | needs: lint 37 | steps: 38 | - name: Checkout 39 | uses: actions/checkout@v4 40 | with: 41 | fetch-depth: 0 42 | - name: Setup Node.js 43 | uses: actions/setup-node@v4 44 | with: 45 | node-version: ${{ env.node_version }} 46 | registry-url: ${{ env.NODE_REGISTRY }} 47 | - name: Enable corepack 48 | run: corepack enable 49 | - name: Install dependencies 50 | run: npx nypm@latest i 51 | - name: Prepare stubs 52 | run: pnpm dev:prepare 53 | - name: Build 54 | run: pnpm prepack 55 | - name: Generate changelog and publish release 56 | run: |- 57 | git config --global user.name "${{ env.changelog_user }}" 58 | git config --global user.email "${{ env.changelog_email }}" 59 | pnpm changelogen --release --push --publish 60 | -------------------------------------------------------------------------------- /docs/content/3.composables/1.useEcho.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: useEcho 3 | description: Composable for working with Echo instance in your code. 4 | navigation: 5 | icon: i-lucide-parentheses 6 | --- 7 | 8 | ## Usage 9 | 10 | By using this composable you can access the global object provided by the plugin and call any method to work with sockets on your backend. 11 | 12 | ::tip 13 | --- 14 | to: https://laravel.com/docs/12.x/broadcasting 15 | target: _blank 16 | --- 17 | For more details about the `Echo` instance and available functions, check official **Laravel Broadcasting** documentation. 18 | :: 19 | 20 | ## Code sample 21 | 22 | Here is an example of a client component subscribing to the public and private channels: 23 | 24 | ```vue [components/Broadcast.client.vue] 25 | 64 | ``` 65 | 66 | ::warning 67 | Keep in mind, for accessing Private and Presence channels you should have configured 68 | authentication on your backend side, preferably Laravel Sanctum. 69 | :: 70 | -------------------------------------------------------------------------------- /docs/content/2.usage/3.token.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Token authentication 3 | description: How to setup Sanctum Bearer token-based authentication for Laravel Echo. 4 | navigation: 5 | icon: i-lucide-shield 6 | --- 7 | 8 | ## Configuration 9 | 10 | ::caution 11 | Beware, that token-based authentication is not recommended for SPA applications. 12 | :: 13 | 14 | Sometimes, token authentication might be useful when you cannot host your application on the same TLD 15 | or have a mobile or desktop application built with Nuxt (e.g. based on Capacitor). 16 | 17 | To explicitly set this authentication mode, update `echo.authentication.mode` configuration property to `token`. 18 | 19 | ::tip 20 | --- 21 | to: https://laravel.com/docs/12.x/sanctum#authorizing-private-broadcast-channels 22 | target: _blank 23 | --- 24 | You can check the official Laravel documentation here - **Authorizing Private Channels**. 25 | :: 26 | 27 | ## How it works 28 | 29 | You should already have an authenticated user by submitting credentials to your login endpoint, 30 | for instance, using the [Nuxt Auth Sanctum](https://sanctum.manchenkoff.me) module. 31 | 32 | Once the module has an authentication state, it will request a CSRF cookie from the API, 33 | and pass it as an XSRF header to each Echo channel authorization request to confirm the current user identity. 34 | 35 | ::callout 36 | Ensure that you use `cookie` mode for `nuxt-auth-sanctum` module 37 | to save the CSRF cookie from the API response on authentication requests. 38 | :: 39 | 40 | ## Custom token storage 41 | 42 | Default token storage uses cookies to keep the Authentication token and 43 | automatically load it for Echo channel authorization requests. 44 | 45 | However, you are free to define custom storage in your `app.config.ts` by implementing an interface 46 | (especially, when cookies are not supported, for example - *Capacitor*, *Ionic*, *LocalStorage*, etc). 47 | 48 | Check this section for more details - [Token storage](/other/token-storage). 49 | -------------------------------------------------------------------------------- /.github/workflows/prerelease.yml: -------------------------------------------------------------------------------- 1 | name: Nuxt [Pre-Release] 2 | env: 3 | node_version: 20 4 | changelog_user: Github CI 5 | changelog_email: artem@manchenkoff.me 6 | NODE_AUTH_TOKEN: ${{ secrets.npm_token }} 7 | NODE_REGISTRY: https://registry.npmjs.org/ 8 | GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }} 9 | concurrency: 10 | group: nuxt-laravel-echo-release 11 | cancel-in-progress: false 12 | permissions: 13 | contents: write 14 | id-token: write 15 | on: workflow_dispatch 16 | jobs: 17 | lint: 18 | runs-on: ubuntu-latest 19 | steps: 20 | - name: Checkout 21 | uses: actions/checkout@v4 22 | - name: Setup Node.js 23 | uses: actions/setup-node@v4 24 | with: 25 | node-version: ${{ env.node_version }} 26 | - name: Enable corepack 27 | run: corepack enable 28 | - name: Install dependencies 29 | run: npx nypm@latest i 30 | - name: Prepare stubs 31 | run: pnpm dev:prepare 32 | - name: Validate package 33 | run: pnpm validate 34 | publish: 35 | runs-on: ubuntu-latest 36 | needs: lint 37 | steps: 38 | - name: Checkout 39 | uses: actions/checkout@v4 40 | with: 41 | fetch-depth: 0 42 | - name: Setup Node.js 43 | uses: actions/setup-node@v4 44 | with: 45 | node-version: ${{ env.node_version }} 46 | registry-url: ${{ env.NODE_REGISTRY }} 47 | - name: Enable corepack 48 | run: corepack enable 49 | - name: Install dependencies 50 | run: npx nypm@latest i 51 | - name: Prepare stubs 52 | run: pnpm dev:prepare 53 | - name: Build 54 | run: pnpm prepack 55 | - name: Generate changelog and publish release 56 | run: |- 57 | git config --global user.name "${{ env.changelog_user }}" 58 | git config --global user.email "${{ env.changelog_email }}" 59 | pnpm changelogen --release --push \ 60 | --publish --prerelease --publishTag beta 61 | -------------------------------------------------------------------------------- /docs/public/logo.svg: -------------------------------------------------------------------------------- 1 | Logomark -------------------------------------------------------------------------------- /docs/content/1.getting-started/2.installation.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Installation 3 | description: How to add nuxt-laravel-echo to your Nuxt application! 4 | navigation: 5 | icon: i-lucide-download 6 | --- 7 | 8 | ## Quick Start 9 | 10 | You can use the following command to install the module 11 | and automatically register it in your `nuxt.config.ts` modules section 12 | 13 | ```bash [Terminal] 14 | npx nuxi@latest module add nuxt-laravel-echo 15 | ``` 16 | 17 | or manually install a dependency via: 18 | 19 | ```bash [Terminal] 20 | pnpm add nuxt-laravel-echo 21 | ``` 22 | 23 | and register the module in your `nuxt.config.ts`: 24 | 25 | ```typescript [nuxt.config.ts] 26 | export default defineNuxtConfig({ 27 | modules: [ 28 | // other modules 29 | 'nuxt-laravel-echo' 30 | ], 31 | 32 | echo: {}, 33 | }) 34 | ``` 35 | 36 | ## Configuration 37 | 38 | Once you have the module installed and registered, provide the 39 | configuration in `nuxt.config.ts` according to your setup. 40 | 41 | ::tip 42 | --- 43 | target: _blank 44 | to: https://laravel.com/docs/11.x/broadcasting#client-reverb 45 | --- 46 | See more details here - **Laravel Broadcasting Client Setup**. 47 | :: 48 | 49 | ```typescript [nuxt.config.ts] 50 | export default defineNuxtConfig({ 51 | //... other parts of the config 52 | 53 | echo: { 54 | key: 'REPLACE_ME', // Your Laravel Echo app key 55 | authentication: { 56 | baseUrl: 'laravel.test', // Your Laravel app URL 57 | }, 58 | }, 59 | }) 60 | ``` 61 | 62 | That's it! You can now use Nuxt Auth Sanctum in your Nuxt app ✨ 63 | 64 | ## Dev server 65 | 66 | If you experience issues during the dev server run (`pnpm run dev`), you should enable compatibility mode for the Pusher 67 | library by adding Vite configuration in your `nuxt.config.ts` like this: 68 | 69 | ```typescript [nuxt.config.ts] 70 | export default defineNuxtConfig({ 71 | // ... other parts of the config 72 | 73 | vite: { 74 | optimizeDeps: { 75 | include: ['nuxt-laravel-echo > pusher-js'], // or ['pusher-js'] for older Vite versions 76 | }, 77 | }, 78 | }) 79 | ``` 80 | -------------------------------------------------------------------------------- /docs/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | export default defineNuxtConfig({ 2 | modules: [ 3 | '@nuxt/eslint', 4 | '@nuxt/image', 5 | '@nuxt/ui', 6 | '@nuxt/content', 7 | 'nuxt-og-image', 8 | 'nuxt-llms' 9 | ], 10 | 11 | devtools: { 12 | enabled: true 13 | }, 14 | 15 | css: ['~/assets/css/main.css'], 16 | 17 | content: { 18 | build: { 19 | markdown: { 20 | toc: { 21 | searchDepth: 1 22 | } 23 | } 24 | } 25 | }, 26 | 27 | compatibilityDate: '2025-01-10', 28 | 29 | nitro: { 30 | prerender: { 31 | routes: [ 32 | '/' 33 | ], 34 | crawlLinks: true, 35 | autoSubfolderIndex: false 36 | } 37 | }, 38 | 39 | eslint: { 40 | config: { 41 | stylistic: { 42 | commaDangle: 'never', 43 | braceStyle: '1tbs' 44 | } 45 | } 46 | }, 47 | 48 | icon: { 49 | provider: 'iconify' 50 | }, 51 | 52 | llms: { 53 | domain: 'https://echo.manchenkoff.me', 54 | title: 'Nuxt - Laravel Echo', 55 | description: 'The only module you need to set up your Laravel Broadcasting for Nuxt application!', 56 | full: { 57 | title: 'Nuxt - Laravel Echo Module Documentation', 58 | description: 'This is the full documentation for Nuxt Laravel Echo module.' 59 | }, 60 | sections: [ 61 | { 62 | title: 'Getting Started', 63 | contentCollection: 'docs', 64 | contentFilters: [ 65 | { field: 'path', operator: 'LIKE', value: '/getting-started%' } 66 | ] 67 | }, 68 | { 69 | title: 'Usage', 70 | contentCollection: 'docs', 71 | contentFilters: [ 72 | { field: 'path', operator: 'LIKE', value: '/usage%' } 73 | ] 74 | }, 75 | { 76 | title: 'Composables', 77 | contentCollection: 'docs', 78 | contentFilters: [ 79 | { field: 'path', operator: 'LIKE', value: '/composables%' } 80 | ] 81 | }, 82 | { 83 | title: 'Other', 84 | contentCollection: 'docs', 85 | contentFilters: [ 86 | { field: 'path', operator: 'LIKE', value: '/other%' } 87 | ] 88 | } 89 | ] 90 | } 91 | }) 92 | -------------------------------------------------------------------------------- /docs/content/4.other/2.interceptors.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Interceptors 3 | description: Check how to use custom interceptors for the fetch client used for Echo API calls. 4 | navigation: 5 | icon: i-lucide-webhook 6 | --- 7 | 8 | ## Usage 9 | 10 | Interceptors allow you to define custom functions that the Echo client will use during API calls. 11 | Here are some examples of what you can do with it: 12 | 13 | - Add custom headers to all requests (e.g. `X-Localization`, `Accept-Language`, etc) 14 | - Use telemetry or logging for requests/responses 15 | - Modify the request payload before sending 16 | 17 | ::warning 18 | If you are not familiar with [ofetch](https://github.com/unjs/ofetch) interceptors, 19 | check [this documentation](https://github.com/unjs/ofetch?tab=readme-ov-file#%EF%B8%8F-interceptors) first. 20 | :: 21 | 22 | ## Define interceptors 23 | 24 | Since `nuxt.config.ts` does not support complex TypeScript types like functions due to hydration, 25 | you have to use `app.config.ts` file to define your interceptors. 26 | 27 | Here is an example of the configuration that writes a log entry for each request and response: 28 | 29 | ```typescript [app/app.config.ts] 30 | import type { FetchContext } from 'ofetch' 31 | import type { ConsolaInstance } from 'consola' 32 | 33 | export default defineAppConfig({ 34 | echo: { 35 | interceptors: { 36 | onRequest: async ( 37 | app: NuxtApp, 38 | ctx: FetchContext, 39 | logger: ConsolaInstance, 40 | ) => { 41 | ctx 42 | .options 43 | .headers 44 | .set('X-Custom-Headers', 'custom-value') 45 | 46 | logger.debug(`[onRequest] custom interceptor (${ctx.request})`) 47 | }, 48 | 49 | onResponse: async ( 50 | app: NuxtApp, 51 | ctx: FetchContext, 52 | logger: ConsolaInstance, 53 | ) => { 54 | logger.debug(`[onResponse] custom interceptor (${ctx.request})`) 55 | }, 56 | }, 57 | }, 58 | }) 59 | ``` 60 | 61 | Each interceptor receives 3 arguments: 62 | 63 | 1. `app` - an instance of the current `NuxtApp` 64 | 2. `ctx` - `FetchContext` instance for the current operation with access to request, response, and options (*query, headers, etc*) 65 | 3. `logger` - an instance of a `Consola` logger used by the module (*will be prefixed with `nuxt-laravel-echo`*) 66 | -------------------------------------------------------------------------------- /src/runtime/plugin.client.ts: -------------------------------------------------------------------------------- 1 | import type Echo from 'laravel-echo' 2 | import type { BroadcastDriver } from 'laravel-echo' 3 | import PusherPkg from 'pusher-js' 4 | import { createConsola } from 'consola' 5 | import type { ConsolaInstance } from 'consola' 6 | import { useEchoConfig } from './composables/useEchoConfig' 7 | import { useEchoAppConfig } from './composables/useEchoAppConfig' 8 | import { createEcho } from './factories/echo' 9 | import { defineNuxtPlugin, updateAppConfig } from '#app' 10 | import type { NuxtApp } from '#app' 11 | 12 | // eslint-disable-next-line @typescript-eslint/no-explicit-any 13 | const Pusher = (PusherPkg as any).default || PusherPkg 14 | 15 | declare global { 16 | interface Window { 17 | Echo: Echo 18 | Pusher: typeof Pusher 19 | } 20 | } 21 | 22 | const MODULE_NAME = 'nuxt-laravel-echo' 23 | 24 | /** 25 | * Create a logger instance for the Echo module 26 | * @param logLevel 27 | */ 28 | function createEchoLogger(logLevel: number) { 29 | return createConsola({ level: logLevel }).withTag(MODULE_NAME) 30 | } 31 | 32 | /** 33 | * Set up default token storage if not defined by the user 34 | * @param nuxtApp The Nuxt application instance 35 | * @param logger The logger instance 36 | */ 37 | async function setupDefaultTokenStorage(nuxtApp: NuxtApp, logger: ConsolaInstance) { 38 | logger.debug( 39 | 'Token storage is not defined, switch to default cookie storage', 40 | ) 41 | 42 | const defaultStorage = await import('./storages/cookieTokenStorage') 43 | 44 | nuxtApp.runWithContext(() => { 45 | updateAppConfig({ 46 | echo: { 47 | tokenStorage: defaultStorage.cookieTokenStorage, 48 | }, 49 | }) 50 | }) 51 | } 52 | 53 | export default defineNuxtPlugin(async (_nuxtApp) => { 54 | const nuxtApp = _nuxtApp as NuxtApp 55 | const config = useEchoConfig() 56 | const appConfig = useEchoAppConfig() 57 | const logger = createEchoLogger(config.logLevel) 58 | 59 | if (config.authentication?.mode === 'token' && !appConfig.tokenStorage) { 60 | await setupDefaultTokenStorage(nuxtApp, logger) 61 | } 62 | 63 | window.Pusher = Pusher 64 | window.Echo = createEcho(nuxtApp, config, logger) 65 | 66 | logger.debug('Laravel Echo client initialized') 67 | 68 | return { 69 | provide: { 70 | echo: window.Echo, 71 | }, 72 | } 73 | }) 74 | -------------------------------------------------------------------------------- /docs/app/components/content/HeroBackground.vue: -------------------------------------------------------------------------------- 1 | 16 | 17 | 89 | -------------------------------------------------------------------------------- /CONTRIBUTING.md: -------------------------------------------------------------------------------- 1 | # How to contribute 2 | 3 | Please follow the guidelines below if you want to contribute to the project. 4 | 5 | If you are working on a new feature, please create an issue on GitHub first. This will help us to understand what you are working on and to avoid duplication of work. 6 | 7 | # Development environment 8 | 9 | You can clone the repo by running the following command: 10 | 11 | ```bash 12 | git clone git@github.com:manchenkoff/nuxt-laravel-echo.git 13 | ``` 14 | 15 | Then you should create a new branch with the following name convention: 16 | 17 | ```bash 18 | git checkout -b XXX-feature-name 19 | ``` 20 | 21 | Where `XXX` is the issue number on the GitHub. 22 | 23 | ## Install dependencies 24 | 25 | To setup the development environment, you should install the dependencies first. You can do this by running the following command: 26 | 27 | ```bash 28 | pnpm install 29 | ``` 30 | 31 | Then you can start dev server to see the playground app: 32 | 33 | ```bash 34 | pnpm dev 35 | ``` 36 | 37 | Or if you want to build the project, you can run one of the following commands: 38 | 39 | ```bash 40 | # Generate type stubs 41 | pnpm dev:prepare 42 | 43 | # Build the playground 44 | pnpm dev:build 45 | ``` 46 | 47 | # Testing process 48 | 49 | To test playground app you need to have a Laravel API running with Sanctum package installed. 50 | 51 | if there are tests for the feature you are working on, you can run them by executing one of the following commands: 52 | 53 | ```bash 54 | # Run Vitest 55 | pnpm test 56 | 57 | # Run Vitest in watch mode 58 | pnpm test:watch 59 | ``` 60 | 61 | # Code Style and Standards 62 | 63 | This project uses ESLint to enforce code style and standards. Please make sure to run the following commands before creating a pull request: 64 | 65 | ```bash 66 | # Run ESLint 67 | pnpm lint 68 | 69 | # Run Nuxt type check 70 | pnpm test:types 71 | 72 | # Run Vitest 73 | pnpm test 74 | ``` 75 | 76 | # Releasing (only for maintainers) 77 | 78 | Once all the changes are merged into main branch, run the following command to release a new version: 79 | 80 | ```bash 81 | pnpm release 82 | ``` 83 | 84 | # Code of Conduct 85 | 86 | All contributors are expected to adhere to the [Code of Conduct](CODE_OF_CONDUCT.md). Please read it. 87 | 88 | # Get in touch 89 | 90 | If you have any questions or need help, feel free to reach out via artem@manchenkoff.me or by opening a new issue on Github. 91 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "nuxt-laravel-echo", 3 | "version": "0.2.11", 4 | "author": { 5 | "name": "Artem Manchenkov", 6 | "email": "artem@manchenkoff.me", 7 | "url": "https://github.com/manchenkoff" 8 | }, 9 | "description": "Nuxt module for Laravel Echo integration", 10 | "homepage": "https://echo.manchenkoff.me", 11 | "repository": { 12 | "type": "git", 13 | "url": "git+https://github.com/manchenkoff/nuxt-laravel-echo.git" 14 | }, 15 | "license": "MIT", 16 | "type": "module", 17 | "exports": { 18 | ".": { 19 | "types": "./dist/types.d.mts", 20 | "import": "./dist/module.mjs" 21 | } 22 | }, 23 | "main": "./dist/module.mjs", 24 | "files": [ 25 | "dist" 26 | ], 27 | "scripts": { 28 | "prepack": "nuxt-module-build build", 29 | "rc": "pnpm pack --pack-destination dist", 30 | "dev": "nuxi dev playground", 31 | "dev:build": "nuxi build playground", 32 | "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground", 33 | "lint": "eslint .", 34 | "lint:fix": "eslint . --fix", 35 | "test": "vitest run", 36 | "test:watch": "vitest watch", 37 | "test:types": "vue-tsc --noEmit && cd playground && vue-tsc --noEmit", 38 | "validate": "pnpm lint && pnpm test:types && pnpm test", 39 | "release": "pnpm lint && pnpm test && pnpm prepack && changelogen --release && npm publish && git push --follow-tags" 40 | }, 41 | "dependencies": { 42 | "defu": "^6.1.4", 43 | "laravel-echo": "^2.2.6", 44 | "ofetch": "^1.5.1", 45 | "pusher-js": "^8.4.0" 46 | }, 47 | "devDependencies": { 48 | "@nuxt/devtools": "^3.1.1", 49 | "@nuxt/eslint-config": "^1.11.0", 50 | "@nuxt/kit": "^4.2.1", 51 | "@nuxt/module-builder": "^1.0.2", 52 | "@nuxt/schema": "^4.2.1", 53 | "@nuxt/test-utils": "^3.21.0", 54 | "@types/node": "^24.10.1", 55 | "changelogen": "^0.6.2", 56 | "eslint": "^9.39.1", 57 | "nuxt": "^4.2.1", 58 | "typescript": "^5.9.3", 59 | "vitest": "^4.0.15", 60 | "vue": "^3.5.25", 61 | "vue-tsc": "^3.1.6" 62 | }, 63 | "packageManager": "pnpm@10.20.0+sha512.cf9998222162dd85864d0a8102e7892e7ba4ceadebbf5a31f9c2fce48dfce317a9c53b9f6464d1ef9042cba2e02ae02a9f7c143a2b438cd93c91840f0192b9dd", 64 | "pnpm": { 65 | "onlyBuiltDependencies": [ 66 | "@parcel/watcher", 67 | "esbuild", 68 | "unrs-resolver" 69 | ] 70 | } 71 | } 72 | -------------------------------------------------------------------------------- /src/runtime/types/options.ts: -------------------------------------------------------------------------------- 1 | import type { BroadcastDriver } from 'laravel-echo' 2 | 3 | export interface Authentication { 4 | /** 5 | * Authentication mode 'cookie' or 'token' 6 | * @default 'cookie' 7 | */ 8 | mode: 'cookie' | 'token' 9 | /** 10 | * The base URL of Laravel application. 11 | * @default 'http://localhost:80' 12 | */ 13 | baseUrl: string 14 | /** 15 | * The endpoint used for channels authentication. 16 | * @default '/broadcasting/auth' 17 | */ 18 | authEndpoint?: string 19 | /** 20 | * The endpoint used for CSRF token retrieval. 21 | * @default '/sanctum/csrf-cookie' 22 | */ 23 | csrfEndpoint?: string 24 | /** 25 | * The name of the CSRF cookie. 26 | * @default 'XSRF-TOKEN' 27 | */ 28 | csrfCookie?: string 29 | /** 30 | * The name of the CSRF header. 31 | * @default 'X-XSRF-TOKEN' 32 | */ 33 | csrfHeader?: string 34 | } 35 | 36 | export interface ModuleOptions { 37 | /** 38 | * The Laravel Broadcasting app key for a secure connection. 39 | * @default undefined 40 | */ 41 | key?: string 42 | /** 43 | * The Laravel broadcaster type to use. 44 | * @default 'reverb' 45 | */ 46 | broadcaster: BroadcastDriver 47 | /** 48 | * The host to connect to WebSocket. 49 | * @default 'localhost' 50 | */ 51 | host?: string 52 | /** 53 | * The port to connect to WebSocket. 54 | * @default 8080 55 | */ 56 | port?: number 57 | /** 58 | * The scheme to use for the connection. 59 | * @default 'https' 60 | */ 61 | scheme: 'http' | 'https' 62 | /** 63 | * The application cluster to connect to. 64 | * @default undefined 65 | */ 66 | cluster?: string 67 | /** 68 | * The transports to enable for the connection. 69 | * @default ['ws','wss'] 70 | */ 71 | transports?: string[] 72 | /** 73 | * Authentication options for Private and Presence channels. 74 | */ 75 | authentication?: Authentication 76 | /** 77 | * The log level to use for the logger. 78 | * 79 | * 0: Fatal and Error 80 | * 1: Warnings 81 | * 2: Normal logs 82 | * 3: Informational logs 83 | * 4: Debug logs 84 | * 5: Trace logs 85 | * 86 | * More details at https://github.com/unjs/consola?tab=readme-ov-file#log-level 87 | * @default 3 88 | */ 89 | logLevel: number 90 | /** 91 | * Additional properties to extend the Echo instance options. 92 | * @default undefined 93 | */ 94 | properties?: object 95 | } 96 | -------------------------------------------------------------------------------- /src/runtime/factories/http.ts: -------------------------------------------------------------------------------- 1 | import type { ConsolaInstance } from 'consola' 2 | import type { FetchContext, FetchOptions } from 'ofetch' 3 | import type { EchoAppConfig, EchoInterceptor } from '../types/config' 4 | import handleCsrfCookie from '../interceptors/csrf' 5 | import handleAuthToken from '../interceptors/token' 6 | import type { Authentication } from '../types/options' 7 | import { useEchoAppConfig } from '../composables/useEchoAppConfig' 8 | import type { NuxtApp } from '#app' 9 | 10 | /** 11 | * Returns a tuple of request and response interceptors. 12 | * Includes both module and user-defined interceptors. 13 | * @param appConfig The Echo application configuration. 14 | */ 15 | function useClientInterceptors(appConfig: EchoAppConfig): [EchoInterceptor[], EchoInterceptor[]] { 16 | const [request, response] = [ 17 | [ 18 | handleCsrfCookie, 19 | handleAuthToken, 20 | ] as EchoInterceptor[], 21 | [] as EchoInterceptor[], 22 | ] 23 | 24 | if (appConfig.interceptors?.onRequest) { 25 | request.push(appConfig.interceptors.onRequest) 26 | } 27 | 28 | if (appConfig.interceptors?.onResponse) { 29 | response.push(appConfig.interceptors.onResponse) 30 | } 31 | 32 | return [request, response] 33 | } 34 | 35 | /** 36 | * Creates a fetch client with interceptors for handling authentication and CSRF tokens. 37 | * @param app The Nuxt application instance. 38 | * @param authentication The authentication configuration. 39 | * @param logger The logger instance. 40 | */ 41 | export function createFetchClient( 42 | app: NuxtApp, 43 | authentication: Required, 44 | logger: ConsolaInstance 45 | ) { 46 | const appConfig = useEchoAppConfig() 47 | 48 | const [ 49 | requestInterceptors, 50 | responseInterceptors, 51 | ] = useClientInterceptors(appConfig) 52 | 53 | const fetchOptions: FetchOptions = { 54 | baseURL: authentication.baseUrl, 55 | credentials: 'include', 56 | retry: false, 57 | 58 | async onRequest(context) { 59 | for (const interceptor of requestInterceptors) { 60 | await app.runWithContext(async () => { 61 | await interceptor(app, context, logger) 62 | }) 63 | } 64 | }, 65 | 66 | async onResponse(context: FetchContext): Promise { 67 | for (const interceptor of responseInterceptors) { 68 | await app.runWithContext(async () => { 69 | await interceptor(app, context, logger) 70 | }) 71 | } 72 | }, 73 | } 74 | 75 | return $fetch.create(fetchOptions) 76 | } 77 | -------------------------------------------------------------------------------- /docs/app/components/OgImage/OgImageDocs.vue: -------------------------------------------------------------------------------- 1 | 19 | 20 | 86 | -------------------------------------------------------------------------------- /docs/content/4.other/1.token-storage.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Token storage 3 | description: How to store your Bearer tokens for Private channels 4 | navigation: 5 | icon: i-lucide-vault 6 | --- 7 | 8 | ## Usage 9 | 10 | Token storage is used for accessing a Bearer token from the Laravel API for Echo private channel authorization requests. 11 | 12 | It is enabled only when `echo.authentication.mode` set to `token`. 13 | 14 | ::note 15 | By default, if there is no custom token storage defined, cookies will be used. 16 | :: 17 | 18 | Each token storage implements the following interface: 19 | 20 | ```typescript [tokenStorage.ts] 21 | /** 22 | * Handlers to work with authentication tokens. 23 | */ 24 | export interface TokenStorage { 25 | /** 26 | * Function to load a token from the storage. 27 | */ 28 | get: (app: NuxtApp) => Promise 29 | /** 30 | * Function to save a token to the storage. 31 | */ 32 | set: (app: NuxtApp, token?: string) => Promise 33 | } 34 | ``` 35 | 36 | After the user sends credentials to the API, module passes a token from the response 37 | to `set` method as well as the current Nuxt application instance to allow calls like `app.runWithConext()`. 38 | 39 | ::tip 40 | Since `nuxt-laravel-echo` does not cover user authentication functionality, 41 | it is better to use it with [`nuxt-auth-sanctum`](https://sanctum.manchenkoff.me) module. 42 | :: 43 | 44 | Once the user logs out, the module sends `undefined` as a token value to reset the stored value. 45 | 46 | Before each request against the API, the module loads the token by calling `get` method with the Nuxt instance passed. 47 | 48 | ## Define token storage 49 | 50 | You can define your own handler in the `app.config.ts` configuration file and it will be automatically used by the module: 51 | 52 | ```typescript [app/app.config.ts] 53 | // LocalStorage example for Laravel Authentication token 54 | const tokenStorageKey = 'echo.storage.token' 55 | const localTokenStorage: TokenStorage = { 56 | get: async () => { 57 | if (import.meta.server) { 58 | return undefined 59 | } 60 | 61 | return window.localStorage.getItem(tokenStorageKey) ?? undefined 62 | }, 63 | 64 | set: async (app: NuxtApp, token?: string) => { 65 | if (import.meta.server) { 66 | return 67 | } 68 | 69 | if (!token) { 70 | window.localStorage.removeItem(tokenStorageKey) 71 | return 72 | } 73 | 74 | window.localStorage.setItem(tokenStorageKey, token) 75 | }, 76 | } 77 | 78 | export default defineAppConfig({ 79 | sanctum: { 80 | tokenStorage: localTokenStorage, 81 | }, 82 | echo: { 83 | tokenStorage: localTokenStorage, 84 | }, 85 | }) 86 | ``` 87 | 88 | Now your application will store tokens in a local storage of your browser. 89 | 90 | ::warning 91 | Keep in mind, `localStorage` is available for **CSR** mode only. 92 | :: 93 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Nuxt Laravel Echo 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![License][license-src]][license-href] 6 | [![Nuxt][nuxt-src]][nuxt-href] 7 | 8 | Nuxt module for Laravel Echo integration to get a seamless experience with application broadcasting. 9 | 10 | - [Documentation](https://echo.manchenkoff.me) 11 | - [Features](#features) 12 | - [Quick Setup](#quick-setup) 13 | - [Release Notes](/CHANGELOG.md) 14 | 15 | ## Features 16 | 17 | This module includes a range of features designed to streamline broadcasting: 18 | 19 | - Sanctum-based authentication 20 | - CSRF cookie and token management for Private and Presence channels 21 | - CSR-only mode (plugin is not loaded in SSR) 22 | - TypeScript support 23 | - Simple configuration 24 | - Request interceptors, token storage, composables and more... 25 | 26 | **Note:** Before using this module, make sure you have a [Laravel Echo](https://laravel.com/docs/12.x/broadcasting) server running and properly configured. 27 | 28 | ## Quick Setup 29 | 30 | Install the module to your Nuxt application with one command: 31 | 32 | ```bash 33 | npx nuxi module add nuxt-laravel-echo 34 | ``` 35 | 36 | Then provide the configuration in your `nuxt.config.js`: 37 | 38 | ```typescript 39 | export default defineNuxtConfig({ 40 | modules: ["nuxt-laravel-echo"], 41 | 42 | echo: { 43 | key: "REPLACE_ME", // Your Laravel Echo app key 44 | authentication: { 45 | baseUrl: "laravel.test", // Your Laravel app URL 46 | }, 47 | }, 48 | }); 49 | ``` 50 | 51 | Also, to enable Dev server compatibility with Pusher, you need to add the following Vite configuration to your `nuxt.config.js`: 52 | 53 | ```typescript 54 | export default defineNuxtConfig({ 55 | vite: { 56 | optimizeDeps: { 57 | include: ["nuxt-laravel-echo > pusher-js"], 58 | }, 59 | }, 60 | }); 61 | ``` 62 | 63 | That's it! You can now use Nuxt Laravel Echo in your Nuxt app ✨ 64 | 65 | ## Contribution 66 | 67 | If you want to contribute to this project and make it better, your help is very welcome. Check the [Contribution Guide](/CONTRIBUTING.md) for more information. 68 | 69 | 70 | 71 | [npm-version-src]: https://img.shields.io/npm/v/nuxt-laravel-echo/latest.svg?style=flat&colorA=020420&colorB=00DC82 72 | [npm-version-href]: https://npmjs.com/package/nuxt-laravel-echo 73 | [npm-downloads-src]: https://img.shields.io/npm/dm/nuxt-laravel-echo.svg?style=flat&colorA=020420&colorB=00DC82 74 | [npm-downloads-href]: https://npm.chart.dev/nuxt-laravel-echo 75 | [license-src]: https://img.shields.io/npm/l/nuxt-laravel-echo.svg?style=flat&colorA=020420&colorB=00DC82 76 | [license-href]: https://npmjs.com/package/nuxt-laravel-echo 77 | [nuxt-src]: https://img.shields.io/badge/Nuxt-020420?logo=nuxt.js 78 | [nuxt-href]: https://nuxt.com 79 | 80 | ### Powered by 81 | 82 | [![JetBrains logo.](https://resources.jetbrains.com/storage/products/company/brand/logos/jetbrains.svg)](https://jb.gg/OpenSource) 83 | -------------------------------------------------------------------------------- /docs/app/pages/[...slug].vue: -------------------------------------------------------------------------------- 1 | 70 | 71 | 129 | -------------------------------------------------------------------------------- /docs/content/1.getting-started/1.index.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Introduction 3 | description: Welcome to Nuxt Laravel Echo module documentation. 4 | navigation: 5 | icon: i-simple-icons-laravel 6 | --- 7 | 8 | This Nuxt module for Laravel Echo integration provides a seamless experience with application broadcasting. 9 | 10 | Since [Laravel Echo](https://laravel.com/docs/11.x/broadcasting) requires additional authentication for Private channels, 11 | you may consider using this module to get this out-of-the-box. 12 | 13 | Nuxt Laravel Echo provides a wrapper on top of [laravel-echo](https://www.npmjs.com/package/laravel-echo) 14 | and [pusher.js](https://www.npmjs.com/package/pusher-js) packages, 15 | that takes care of creating an Echo instance and setting up an authentication handler. 16 | 17 | ## Key Features 18 | 19 | This module includes a range of features designed to streamline broadcasting: 20 | 21 | - **Sanctum**-based authentication 22 | - **CSRF** cookie and token management for Private and Presence channels 23 | - **CSR-only** mode (plugin is not loaded in SSR) 24 | - **TypeScript** support 25 | - **Simple** configuration 26 | - Request interceptors, token storage, composables and more... 27 | 28 | ::warning 29 | --- 30 | target: _blank 31 | to: https://laravel.com/docs/12.x/broadcasting 32 | --- 33 | **Note**: Before using this module, please configure Laravel Echo / Reverb on your backend. 34 | Click to learn more. 35 | :: 36 | 37 | We recommend looking at our [breeze-nuxt](https://github.com/manchenkoff/breeze-nuxt) template that works flawlessly with 38 | [breeze-api](https://github.com/manchenkoff/breeze-api) Laravel application with preconfigured Sanctum and Echo modules. 39 | 40 | ## Ecosystem 41 | 42 | This project is a part of Nuxt Laravel modules ecosystem which you may find useful: 43 | 44 | ::card-group 45 | :::card 46 | --- 47 | icon: i-lucide-lock 48 | target: _blank 49 | title: Sanctum 50 | to: https://github.com/manchenkoff/nuxt-auth-sanctum 51 | --- 52 | Module for Sanctum authentication 53 | ::: 54 | 55 | :::card 56 | --- 57 | icon: i-lucide-radio 58 | target: _blank 59 | title: Echo 60 | to: https://github.com/manchenkoff/nuxt-laravel-echo 61 | --- 62 | Module for Echo broadcasting 63 | ::: 64 | 65 | :::card 66 | --- 67 | icon: i-lucide-badge-check 68 | target: _blank 69 | title: Precognition 70 | to: https://github.com/manchenkoff/nuxt-sanctum-precognition 71 | --- 72 | Module for Precognition form validation and Nuxt UI support, based on Sanctum 73 | ::: 74 | 75 | :::card 76 | --- 77 | icon: i-simple-icons-nuxt 78 | target: _blank 79 | title: Breeze Nuxt 80 | to: https://github.com/manchenkoff/breeze-nuxt 81 | --- 82 | Nuxt application starter with configured modules for Laravel 83 | ::: 84 | 85 | :::card 86 | --- 87 | icon: i-simple-icons-laravel 88 | target: _blank 89 | title: Breeze API 90 | to: https://github.com/manchenkoff/breeze-api 91 | --- 92 | Laravel API application starter with preconfigured Sanctum, Echo and Precognition 93 | ::: 94 | :: 95 | 96 | ## Support 97 | 98 | If you like this module, please support the project to help me maintain and improve it! 99 | 100 | Buy Me A Coffee 101 | 102 | -------------------------------------------------------------------------------- /src/runtime/factories/echo.ts: -------------------------------------------------------------------------------- 1 | import type { ConsolaInstance } from 'consola' 2 | import Echo from 'laravel-echo' 3 | import type { BroadcastDriver, EchoOptions } from 'laravel-echo' 4 | import type { Channel, ChannelAuthorizationCallback, Options } from 'pusher-js' 5 | import type { ChannelAuthorizationData } from 'pusher-js/types/src/core/auth/options' 6 | import type { Authentication, ModuleOptions } from '../types/options' 7 | import { createFetchClient } from './http' 8 | import { createError } from '#app' 9 | import type { NuxtApp } from '#app' 10 | 11 | /** 12 | * Creates an authorizer function for the Echo instance. 13 | * @param app The Nuxt application instance 14 | * @param authentication The authentication options 15 | * @param logger The logger instance 16 | */ 17 | function createAuthorizer( 18 | app: NuxtApp, 19 | authentication: Required, 20 | logger: ConsolaInstance 21 | ) { 22 | const client = createFetchClient(app, authentication, logger) 23 | 24 | return (channel: Channel, _: Options) => { 25 | return { 26 | authorize: (socketId: string, callback: ChannelAuthorizationCallback) => { 27 | const payload = JSON.stringify({ 28 | socket_id: socketId, 29 | channel_name: channel.name, 30 | }) 31 | 32 | client(authentication.authEndpoint, { 33 | method: 'post', 34 | body: payload, 35 | }) 36 | .then((response: ChannelAuthorizationData) => 37 | callback(null, response) 38 | ) 39 | .catch((error: Error | null) => callback(error, null)) 40 | }, 41 | } 42 | } 43 | } 44 | 45 | /** 46 | * Prepares the options for the Echo instance. 47 | * Returns Pusher or Reverb options based on the broadcaster. 48 | * @param app The Nuxt application instance 49 | * @param config The module options 50 | * @param logger The logger instance 51 | */ 52 | function prepareEchoOptions(app: NuxtApp, config: ModuleOptions, logger: ConsolaInstance): EchoOptions { 53 | const forceTLS = config.scheme === 'https' 54 | const additionalOptions = config.properties || {} 55 | 56 | const authorizer = config.authentication 57 | ? createAuthorizer( 58 | app, 59 | config.authentication as Required, 60 | logger 61 | ) 62 | : undefined 63 | 64 | // Create a Pusher instance 65 | if (config.broadcaster === 'pusher') { 66 | if (!forceTLS) { 67 | throw createError('Pusher requires a secure connection (schema: "https")') 68 | } 69 | 70 | return { 71 | broadcaster: config.broadcaster, 72 | key: config.key, 73 | cluster: config.cluster, 74 | forceTLS, 75 | authorizer, 76 | ...additionalOptions, 77 | } as EchoOptions<'pusher'> 78 | } 79 | 80 | // Create a Reverb instance 81 | if (config.broadcaster === 'reverb') { 82 | return { 83 | broadcaster: config.broadcaster, 84 | key: config.key, 85 | wsHost: config.host, 86 | wsPort: config.port, 87 | wssPort: config.port, 88 | forceTLS, 89 | enabledTransports: config.transports, 90 | authorizer, 91 | ...additionalOptions, 92 | } as EchoOptions<'reverb'> 93 | } 94 | 95 | throw new Error(`Unsupported broadcaster: ${config.broadcaster}`) 96 | } 97 | 98 | /** 99 | * Returns a new instance of Echo with configured authentication. 100 | * @param app The Nuxt application instance 101 | * @param config The module options 102 | * @param logger The logger instance 103 | */ 104 | export function createEcho(app: NuxtApp, config: ModuleOptions, logger: ConsolaInstance) { 105 | const options = prepareEchoOptions(app, config, logger) 106 | 107 | return new Echo(options) 108 | } 109 | -------------------------------------------------------------------------------- /docs/content/index.md: -------------------------------------------------------------------------------- 1 | --- 2 | seo: 3 | title: Nuxt - Laravel Echo 4 | description: Nuxt module for Laravel Echo integration to get a seamless experience with application broadcasting. 5 | --- 6 | 7 | ::u-page-hero{class="dark:bg-gradient-to-b from-neutral-900 to-neutral-950"} 8 | --- 9 | orientation: horizontal 10 | --- 11 | #top 12 | :hero-background 13 | 14 | #title 15 | Use broadcasting [easily]{.text-primary}. 16 | 17 | #description 18 | The only module you need to set up your Laravel Broadcasting for Nuxt application! 19 | 20 | #links 21 | :::u-button 22 | --- 23 | to: /getting-started 24 | size: xl 25 | trailing-icon: i-lucide-arrow-right 26 | --- 27 | Get started 28 | ::: 29 | 30 | :::u-button 31 | --- 32 | icon: i-simple-icons-github 33 | color: neutral 34 | variant: outline 35 | size: xl 36 | to: https://github.com/sponsors/manchenkoff?o=esb 37 | target: _blank 38 | --- 39 | Support project 40 | ::: 41 | 42 | :::u-button 43 | --- 44 | icon: i-simple-icons-buymeacoffee 45 | color: neutral 46 | variant: outline 47 | size: xl 48 | to: https://buymeacoffee.com/manchenkoff 49 | target: _blank 50 | --- 51 | Buy me a coffee 52 | ::: 53 | 54 | 55 | #default 56 | :::prose-pre 57 | --- 58 | code: npx nuxi@latest module add nuxt-laravel-echo 59 | filename: Install module 60 | --- 61 | 62 | ```bash 63 | npx nuxi@latest module add nuxt-laravel-echo 64 | ``` 65 | ::: 66 | :: 67 | 68 | ::u-page-section{class="dark:bg-neutral-950"} 69 | #title 70 | Features 71 | 72 | #links 73 | :::u-button 74 | --- 75 | color: neutral 76 | size: lg 77 | to: /getting-started 78 | trailingIcon: i-lucide-arrow-right 79 | variant: subtle 80 | --- 81 | Explore Nuxt Laravel Echo 82 | ::: 83 | 84 | #features 85 | :::u-page-feature 86 | --- 87 | icon: i-lucide-user-lock 88 | --- 89 | #title 90 | Sanctum-based 91 | 92 | #description 93 | Module leverages Sanctum security for Private and Presence channels 94 | ::: 95 | 96 | :::u-page-feature 97 | --- 98 | icon: i-lucide-cookie 99 | --- 100 | #title 101 | CSRF management 102 | 103 | #description 104 | All Private/Presence channels cookie management is on us, focus on broadcasting! 105 | ::: 106 | 107 | :::u-page-feature 108 | --- 109 | icon: i-lucide-tablet-smartphone 110 | --- 111 | #title 112 | CSR-only 113 | 114 | #description 115 | Since Laravel Echo relies on the browser, this module works only in Client mode (SSR is disabled) 116 | ::: 117 | 118 | :::u-page-feature 119 | --- 120 | icon: i-simple-icons-typescript 121 | --- 122 | #title 123 | TypeScript 124 | 125 | #description 126 | Code of this module is written entirely in TypeScript and supports autocompletion 127 | ::: 128 | 129 | :::u-page-feature 130 | --- 131 | icon: i-lucide-cog 132 | --- 133 | #title 134 | Predefined configuration 135 | 136 | #description 137 | You just set your Laravel URL and Echo key and you are ready to go! 138 | ::: 139 | 140 | :::u-page-feature 141 | --- 142 | icon: i-lucide-git-pull-request 143 | --- 144 | #title 145 | Open-source 146 | 147 | #description 148 | Source code is forever-free and open for contributions! 149 | ::: 150 | :: 151 | 152 | ::u-page-section{class="dark:bg-gradient-to-b from-neutral-950 to-neutral-900"} 153 | :::u-page-c-t-a 154 | --- 155 | links: 156 | - label: Start broadcasting 157 | to: '/getting-started' 158 | trailingIcon: i-lucide-arrow-right 159 | - label: View on GitHub 160 | to: 'https://github.com/manchenkoff/nuxt-laravel-echo' 161 | target: _blank 162 | variant: subtle 163 | icon: i-simple-icons-github 164 | title: Ready to send an amazing event? 165 | description: Broadcast hundreds of events with Laravel, Echo and Nuxt today! 166 | class: dark:bg-neutral-950 167 | --- 168 | 169 | :stars-background 170 | ::: 171 | :: 172 | 173 | -------------------------------------------------------------------------------- /docs/content/2.usage/1.config.md: -------------------------------------------------------------------------------- 1 | --- 2 | title: Configuration 3 | description: Detailed description of available module options. 4 | 5 | navigation: 6 | icon: i-lucide-cog 7 | --- 8 | 9 | ## Default configuration 10 | 11 | By default, the module uses the following configuration values that you can adjust: 12 | 13 | ```typescript [nuxt.config.ts] 14 | export default defineNuxtConfig({ 15 | modules: ['nuxt-laravel-echo'], 16 | 17 | echo: { 18 | broadcaster: 'reverb', // available: reverb, pusher 19 | host: 'localhost', 20 | port: 8080, 21 | scheme: 'https', // available: http, https 22 | transports: ['ws', 'wss'], 23 | authentication: { 24 | mode: 'cookie', 25 | baseUrl: 'http://localhost:80', 26 | authEndpoint: '/broadcasting/auth', 27 | csrfEndpoint: '/sanctum/csrf-cookie', 28 | csrfCookie: 'XSRF-TOKEN', 29 | csrfHeader: 'X-XSRF-TOKEN', 30 | }, 31 | logLevel: 3, 32 | properties: undefined, 33 | }, 34 | }) 35 | ``` 36 | 37 | If you don't specify any value in your `nuxt.config.ts`, then the default config will be used on plugin initialization. 38 | 39 | ## Overrides 40 | 41 | Module configuration is exposed to `runtimeConfig` property of your Nuxt app, 42 | so you can override either in `echo` module config or `runtimeConfig.public.echo` property. 43 | 44 | ```typescript [nuxt.config.ts] 45 | export default defineNuxtConfig({ 46 | modules: ['nuxt-laravel-echo'], 47 | 48 | echo: { 49 | key: 'MY_APP_KEY', 50 | }, 51 | 52 | runtimeConfig: { 53 | public: { 54 | echo: { 55 | logLevel: 3, 56 | }, 57 | }, 58 | }, 59 | }) 60 | ``` 61 | 62 | ## Environment variables 63 | 64 | It is possible to override options via environment variables too. 65 | It might be useful when you want to use `.env` file to provide key for the broadcast backend. 66 | 67 | And here is what it will look like in `.env` file: 68 | 69 | ```env [.env] 70 | NUXT_PUBLIC_ECHO_KEY='REPLACE_ME' 71 | ``` 72 | 73 | ## Available options 74 | 75 | For any additional configurations, you can adjust the next list of available parameters: 76 | 77 | | Parameter | Description | Default | 78 | | --------- | ----------- | ------- | 79 | | **key** | The Laravel Broadcasting app key for a secure connection. | `undefined` | 80 | | **broadcaster** | The Laravel broadcaster type to use. Use reverb or pusher. | `reverb` | 81 | | **host** | The host to connect to WebSocket. | `localhost` | 82 | | **port** | The port to connect to WebSocket. | `8080` | 83 | | **scheme** | The scheme to use for the connection. Use http or https. | `https` | 84 | | **cluster** | The application cluster to connect to. | `undefined` | 85 | | **transports** | The transports to enable for the connection. | `['ws', 'wss']` | 86 | | **authentication** | Authentication options for Private and Presence channels. | `object` | 87 | | **authentication.mode** | Authentication mode cookie or token | `cookie` | 88 | | **authentication.baseUrl** | The base URL of Laravel application. | `http://localhost:80` | 89 | | **authentication.authEndpoint** | The endpoint used for channels authentication. | `/broadcasting/auth` | 90 | | **authentication.csrfEndpoint** | The endpoint used for CSRF token retrieval. | `/sanctum/csrf-cookie` | 91 | | **authentication.csrfCookie** | The name of the CSRF cookie. | `XSRF-TOKEN` | 92 | | **authentication.csrfHeader** | The name of the CSRF header. | `X-XSRF-TOKEN` | 93 | | **logLevel** | The log level to use for the logger. | `3` | 94 | | **properties** | Additional properties to extend the Echo instance options. See Additional properties section. | `undefined` | 95 | 96 | ## Additional properties 97 | 98 | When you are using the Pusher backend, you may need to assign additional properties to your Echo instance object such as: 99 | 100 | - enableStats 101 | - activityTimeout 102 | - etc 103 | 104 | For these, you can override `echo.properties` parameter to pass all the details that are not included in the default config: 105 | 106 | ```typescript [nuxt.config.ts] 107 | export default defineNuxtConfig({ 108 | modules: ['nuxt-laravel-echo'], 109 | 110 | echo: { 111 | key: 'REPLACE_ME', 112 | properties: { 113 | customField: 'customValue', 114 | }, 115 | }, 116 | }) 117 | ``` 118 | -------------------------------------------------------------------------------- /docs/app/app.config.ts: -------------------------------------------------------------------------------- 1 | const siteName = 'Nuxt - Laravel Echo' 2 | 3 | export default defineAppConfig({ 4 | ui: { 5 | colors: { 6 | primary: 'red', 7 | neutral: 'zinc' 8 | }, 9 | footer: { 10 | slots: { 11 | root: 'border-t border-default', 12 | left: 'text-sm text-muted' 13 | } 14 | } 15 | }, 16 | seo: { 17 | siteName: siteName 18 | }, 19 | header: { 20 | title: siteName, 21 | to: '/', 22 | logo: { 23 | alt: 'Laravel Echo', 24 | light: 'logo.svg', 25 | dark: 'logo.svg' 26 | }, 27 | search: true, 28 | colorMode: true, 29 | links: [ 30 | { 31 | 'icon': 'i-simple-icons-github', 32 | 'to': 'https://github.com/manchenkoff/nuxt-laravel-echo', 33 | 'target': '_blank', 34 | 'aria-label': 'GitHub' 35 | }, 36 | { 37 | 'icon': 'i-simple-icons-nuxt', 38 | 'to': 'https://nuxt.com/modules/nuxt-laravel-echo', 39 | 'target': '_blank', 40 | 'aria-label': 'Nuxt Module' 41 | } 42 | ] 43 | }, 44 | footer: { 45 | credits: `Artem Manchenkov © ${new Date().getFullYear()}`, 46 | colorMode: false, 47 | links: [ 48 | { 49 | 'icon': 'i-simple-icons-github', 50 | 'to': 'https://github.com/manchenkoff', 51 | 'target': '_blank', 52 | 'aria-label': 'manchenkoff on GitHub' 53 | }, 54 | { 55 | 'icon': 'i-simple-icons-twitter', 56 | 'to': 'https://twitter.com/amanchenkov', 57 | 'target': '_blank', 58 | 'aria-label': 'manchenkoff on X' 59 | }, 60 | { 61 | 'icon': 'i-simple-icons-facebook', 62 | 'to': 'https://fb.com/manchenkoff', 63 | 'target': '_blank', 64 | 'aria-label': 'manchenkoff on Facebook' 65 | }, 66 | { 67 | 'icon': 'i-simple-icons-linkedin', 68 | 'to': 'https://linkedin.com/in/manchenkoff', 69 | 'target': '_blank', 70 | 'aria-label': 'manchenkoff on LinkedIn' 71 | }, 72 | { 73 | 'icon': 'i-simple-icons-instagram', 74 | 'to': 'https://instagram.com/manchenkof', 75 | 'target': '_blank', 76 | 'aria-label': 'manchenkoff on Instagram' 77 | }, 78 | { 79 | 'icon': 'i-simple-icons-threads', 80 | 'to': 'https://threads.net/@manchenkof', 81 | 'target': '_blank', 82 | 'aria-label': 'manchenkoff on Threads' 83 | }, 84 | { 85 | 'icon': 'i-simple-icons-youtube', 86 | 'to': 'https://youtube.com/@manchenkoff', 87 | 'target': '_blank', 88 | 'aria-label': 'manchenkoff on YouTube' 89 | }, 90 | { 91 | 'icon': 'i-simple-icons-medium', 92 | 'to': 'https://manchenkoff.medium.com/', 93 | 'target': '_blank', 94 | 'aria-label': 'manchenkoff on Medium' 95 | }, 96 | { 97 | 'icon': 'i-simple-icons-telegram', 98 | 'to': 'https://t.me/manchenkoff', 99 | 'target': '_blank', 100 | 'aria-label': 'manchenkoff on Telegram' 101 | }, 102 | { 103 | 'icon': 'i-simple-icons-bluesky', 104 | 'to': 'https://bsky.app/profile/manchenkoff.bsky.social', 105 | 'target': '_blank', 106 | 'aria-label': 'manchenkoff on Bluesky' 107 | } 108 | ] 109 | }, 110 | toc: { 111 | title: 'Table of Contents', 112 | bottom: { 113 | title: 'Ready to contribute?', 114 | edit: 'https://github.com/manchenkoff/nuxt-laravel-echo/edit/main/docs/content', 115 | links: [ 116 | { 117 | icon: 'i-lucide-star', 118 | label: 'Star on GitHub', 119 | to: 'https://github.com/manchenkoff/nuxt-laravel-echo', 120 | target: '_blank' 121 | }, 122 | { 123 | icon: 'i-lucide-git-pull-request-create', 124 | label: 'Suggest a feature', 125 | to: 'https://github.com/manchenkoff/nuxt-laravel-echo/issues/new?template=feature_request.md', 126 | target: '_blank' 127 | }, 128 | { 129 | icon: 'i-simple-icons-github', 130 | label: 'Support project', 131 | to: 'https://github.com/sponsors/manchenkoff?o=esb', 132 | target: '_blank' 133 | }, 134 | { 135 | icon: 'i-simple-icons-buymeacoffee', 136 | label: 'Buy me a coffee', 137 | to: 'https://buymeacoffee.com/manchenkoff', 138 | target: '_blank' 139 | } 140 | ] 141 | } 142 | } 143 | }) 144 | -------------------------------------------------------------------------------- /CODE_OF_CONDUCT.md: -------------------------------------------------------------------------------- 1 | # Contributor Covenant Code of Conduct 2 | 3 | ## Our Pledge 4 | 5 | We as members, contributors, and leaders pledge to make participation in our 6 | community a harassment-free experience for everyone, regardless of age, body 7 | size, visible or invisible disability, ethnicity, sex characteristics, gender 8 | identity and expression, level of experience, education, socio-economic status, 9 | nationality, personal appearance, race, religion, or sexual identity 10 | and orientation. 11 | 12 | We pledge to act and interact in ways that contribute to an open, welcoming, 13 | diverse, inclusive, and healthy community. 14 | 15 | ## Our Standards 16 | 17 | Examples of behavior that contributes to a positive environment for our 18 | community include: 19 | 20 | - Demonstrating empathy and kindness toward other people 21 | - Being respectful of differing opinions, viewpoints, and experiences 22 | - Giving and gracefully accepting constructive feedback 23 | - Accepting responsibility and apologizing to those affected by our mistakes, 24 | and learning from the experience 25 | - Focusing on what is best not just for us as individuals, but for the 26 | overall community 27 | 28 | Examples of unacceptable behavior include: 29 | 30 | - The use of sexualized language or imagery, and sexual attention or 31 | advances of any kind 32 | - Trolling, insulting or derogatory comments, and personal or political attacks 33 | - Public or private harassment 34 | - Publishing others' private information, such as a physical or email 35 | address, without their explicit permission 36 | - Other conduct which could reasonably be considered inappropriate in a 37 | professional setting 38 | 39 | ## Enforcement Responsibilities 40 | 41 | Community leaders are responsible for clarifying and enforcing our standards of 42 | acceptable behavior and will take appropriate and fair corrective action in 43 | response to any behavior that they deem inappropriate, threatening, offensive, 44 | or harmful. 45 | 46 | Community leaders have the right and responsibility to remove, edit, or reject 47 | comments, commits, code, wiki edits, issues, and other contributions that are 48 | not aligned to this Code of Conduct, and will communicate reasons for moderation 49 | decisions when appropriate. 50 | 51 | ## Scope 52 | 53 | This Code of Conduct applies within all community spaces, and also applies when 54 | an individual is officially representing the community in public spaces. 55 | Examples of representing our community include using an official e-mail address, 56 | posting via an official social media account, or acting as an appointed 57 | representative at an online or offline event. 58 | 59 | ## Enforcement 60 | 61 | Instances of abusive, harassing, or otherwise unacceptable behavior may be 62 | reported to the community leaders responsible for enforcement at 63 | artem@manchenkoff.me. 64 | All complaints will be reviewed and investigated promptly and fairly. 65 | 66 | All community leaders are obligated to respect the privacy and security of the 67 | reporter of any incident. 68 | 69 | ## Enforcement Guidelines 70 | 71 | Community leaders will follow these Community Impact Guidelines in determining 72 | the consequences for any action they deem in violation of this Code of Conduct: 73 | 74 | ### 1. Correction 75 | 76 | **Community Impact**: Use of inappropriate language or other behavior deemed 77 | unprofessional or unwelcome in the community. 78 | 79 | **Consequence**: A private, written warning from community leaders, providing 80 | clarity around the nature of the violation and an explanation of why the 81 | behavior was inappropriate. A public apology may be requested. 82 | 83 | ### 2. Warning 84 | 85 | **Community Impact**: A violation through a single incident or series 86 | of actions. 87 | 88 | **Consequence**: A warning with consequences for continued behavior. No 89 | interaction with the people involved, including unsolicited interaction with 90 | those enforcing the Code of Conduct, for a specified period of time. This 91 | includes avoiding interactions in community spaces as well as external channels 92 | like social media. Violating these terms may lead to a temporary or 93 | permanent ban. 94 | 95 | ### 3. Temporary Ban 96 | 97 | **Community Impact**: A serious violation of community standards, including 98 | sustained inappropriate behavior. 99 | 100 | **Consequence**: A temporary ban from any sort of interaction or public 101 | communication with the community for a specified period of time. No public or 102 | private interaction with the people involved, including unsolicited interaction 103 | with those enforcing the Code of Conduct, is allowed during this period. 104 | Violating these terms may lead to a permanent ban. 105 | 106 | ### 4. Permanent Ban 107 | 108 | **Community Impact**: Demonstrating a pattern of violation of community 109 | standards, including sustained inappropriate behavior, harassment of an 110 | individual, or aggression toward or disparagement of classes of individuals. 111 | 112 | **Consequence**: A permanent ban from any sort of public interaction within 113 | the community. 114 | 115 | ## Attribution 116 | 117 | This Code of Conduct is adapted from the [Contributor Covenant][homepage], 118 | version 2.0, available at 119 | https://www.contributor-covenant.org/version/2/0/code_of_conduct.html. 120 | 121 | Community Impact Guidelines were inspired by [Mozilla's code of conduct 122 | enforcement ladder](https://github.com/mozilla/diversity). 123 | 124 | [homepage]: https://www.contributor-covenant.org 125 | 126 | For answers to common questions about this code of conduct, see the FAQ at 127 | https://www.contributor-covenant.org/faq. Translations are available at 128 | https://www.contributor-covenant.org/translations. 129 | -------------------------------------------------------------------------------- /docs/app/components/content/StarsBackground.vue: -------------------------------------------------------------------------------- 1 | 62 | 63 | 153 | 154 | 189 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | 4 | ## v0.2.11 5 | 6 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.10...v0.2.11) 7 | 8 | ## v0.2.10 9 | 10 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.9...v0.2.10) 11 | 12 | ### 🏡 Chore 13 | 14 | - Added local release pack command ([1239586](https://github.com/manchenkoff/nuxt-laravel-echo/commit/1239586)) 15 | - **deps-dev:** Bump @nuxt/devtools from 2.7.0 to 3.0.1 ([6ed4ab2](https://github.com/manchenkoff/nuxt-laravel-echo/commit/6ed4ab2)) 16 | - **docs:** Updated readme ([ef550eb](https://github.com/manchenkoff/nuxt-laravel-echo/commit/ef550eb)) 17 | - Remove outdated type augmentation ([3d76c4a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/3d76c4a)) 18 | 19 | ### ❤️ Contributors 20 | 21 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 22 | 23 | ## v0.2.9 24 | 25 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.8...v0.2.9) 26 | 27 | ### 🚀 Enhancements 28 | 29 | - Added docs application based on nuxt content ([2b501b2](https://github.com/manchenkoff/nuxt-laravel-echo/commit/2b501b2)) 30 | - Added github action for docs deployment ([32b41fa](https://github.com/manchenkoff/nuxt-laravel-echo/commit/32b41fa)) 31 | 32 | ### 🩹 Fixes 33 | 34 | - Use subdir prefix for nuxt docs ([06e9354](https://github.com/manchenkoff/nuxt-laravel-echo/commit/06e9354)) 35 | - Updated docs page icon ([35ea46f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/35ea46f)) 36 | - Use correct og image component name ([17a2ddd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/17a2ddd)) 37 | - Use new domain for docs ([fde7fe3](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fde7fe3)) 38 | - Updated links to new websites ([9a414f0](https://github.com/manchenkoff/nuxt-laravel-echo/commit/9a414f0)) 39 | - Updated Edit link and removed redundant github action ([f97cee6](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f97cee6)) 40 | 41 | ### 🏡 Chore 42 | 43 | - Updated icons and fixed typo ([15d77fe](https://github.com/manchenkoff/nuxt-laravel-echo/commit/15d77fe)) 44 | - Added yaml linter configs ([b5d8a3f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b5d8a3f)) 45 | - **ci:** Trigger docs deployment only if changed ([d5c2553](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d5c2553)) 46 | 47 | ### ❤️ Contributors 48 | 49 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 50 | 51 | ## v0.2.8 52 | 53 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.7...v0.2.8) 54 | 55 | ### 🏡 Chore 56 | 57 | - **deps-dev:** Bump nuxt from 4.0.1 to 4.0.2 ([fe32085](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fe32085)) 58 | - **deps-dev:** Bump @nuxt/eslint-config from 1.7.0 to 1.7.1 ([b0485fa](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b0485fa)) 59 | - **deps-dev:** Bump eslint from 9.31.0 to 9.32.0 ([2ef1f14](https://github.com/manchenkoff/nuxt-laravel-echo/commit/2ef1f14)) 60 | - **deps-dev:** Bump @nuxt/kit from 4.0.1 to 4.0.2 ([bc030a4](https://github.com/manchenkoff/nuxt-laravel-echo/commit/bc030a4)) 61 | - **deps-dev:** Bump @nuxt/module-builder from 1.0.1 to 1.0.2 ([843fcae](https://github.com/manchenkoff/nuxt-laravel-echo/commit/843fcae)) 62 | - **deps-dev:** Bump nuxt in the npm_and_yarn group across 1 directory ([0d5bcd5](https://github.com/manchenkoff/nuxt-laravel-echo/commit/0d5bcd5)) 63 | 64 | ### 🤖 CI 65 | 66 | - Simplify github actions ([f4e9eea](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f4e9eea)) 67 | 68 | ### ❤️ Contributors 69 | 70 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 71 | 72 | ## v0.2.7 73 | 74 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.6...v0.2.7) 75 | 76 | ### 🩹 Fixes 77 | 78 | - Bump packages and fixed vulnerability ([a04d7dd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a04d7dd)) 79 | 80 | ### ❤️ Contributors 81 | 82 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 83 | 84 | ## v0.2.6 85 | 86 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.5...v0.2.6) 87 | 88 | ### 🏡 Chore 89 | 90 | - **deps-dev:** Bump @nuxt/kit from 3.17.3 to 3.17.4 ([2008bc6](https://github.com/manchenkoff/nuxt-laravel-echo/commit/2008bc6)) 91 | - **deps-dev:** Bump @types/node from 22.15.17 to 22.15.29 ([13de480](https://github.com/manchenkoff/nuxt-laravel-echo/commit/13de480)) 92 | - **deps-dev:** Bump @nuxt/eslint-config from 1.3.1 to 1.4.1 ([76c9efc](https://github.com/manchenkoff/nuxt-laravel-echo/commit/76c9efc)) 93 | - **deps-dev:** Bump @nuxt/test-utils from 3.18.0 to 3.19.1 ([11d200a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/11d200a)) 94 | - **deps-dev:** Bump nuxt from 3.17.3 to 3.17.5 ([d2714ed](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d2714ed)) 95 | - **deps-dev:** Bump vitest from 3.1.3 to 3.2.4 ([75cc25e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/75cc25e)) 96 | - **deps-dev:** Bump @types/node from 22.15.29 to 24.0.8 ([46dcf25](https://github.com/manchenkoff/nuxt-laravel-echo/commit/46dcf25)) 97 | - **deps-dev:** Bump @nuxt/devtools from 2.4.0 to 2.6.0 ([43fa262](https://github.com/manchenkoff/nuxt-laravel-echo/commit/43fa262)) 98 | - **deps-dev:** Bump eslint from 9.26.0 to 9.30.0 ([a06a8ca](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a06a8ca)) 99 | - Bump packages and apply formatting ([8a0d8c4](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8a0d8c4)) 100 | 101 | ### ❤️ Contributors 102 | 103 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 104 | 105 | ## v0.2.5 106 | 107 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.4...v0.2.5) 108 | 109 | ### 🩹 Fixes 110 | 111 | - Throw error on unsupported broadcaster ([6928940](https://github.com/manchenkoff/nuxt-laravel-echo/commit/6928940)) 112 | 113 | ### 🏡 Chore 114 | 115 | - **deps-dev:** Bump @nuxt/kit from 3.16.2 to 3.17.1 ([ff692ff](https://github.com/manchenkoff/nuxt-laravel-echo/commit/ff692ff)) 116 | - **deps-dev:** Bump nuxt from 3.16.2 to 3.17.1 ([31c4b4c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/31c4b4c)) 117 | - **deps-dev:** Bump @nuxt/devtools from 2.3.2 to 2.4.0 ([fe5eb2c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fe5eb2c)) 118 | - **deps-dev:** Bump @nuxt/module-builder from 0.8.4 to 1.0.1 ([71607cb](https://github.com/manchenkoff/nuxt-laravel-echo/commit/71607cb)) 119 | - **deps-dev:** Bump vue-tsc from 2.2.8 to 2.2.10 ([2bfdca8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/2bfdca8)) 120 | 121 | ### 🤖 CI 122 | 123 | - Added github action permissions ([4751880](https://github.com/manchenkoff/nuxt-laravel-echo/commit/4751880)) 124 | 125 | ### ❤️ Contributors 126 | 127 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 128 | 129 | ## v0.2.4 130 | 131 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.3...v0.2.4) 132 | 133 | ### 🚀 Enhancements 134 | 135 | - **interceptors:** Added support for custom user-defined ofetch interceptors ([fbe90b7](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fbe90b7)) 136 | 137 | ### 🏡 Chore 138 | 139 | - **deps-dev:** Bump vite from 6.2.3 to 6.2.4 in the npm_and_yarn group ([f60c179](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f60c179)) 140 | - **deps-dev:** Bump @nuxt/devtools from 2.3.1 to 2.3.2 ([b45ca4b](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b45ca4b)) 141 | - **deps-dev:** Bump @nuxt/eslint-config from 1.2.0 to 1.3.0 ([5bd39f6](https://github.com/manchenkoff/nuxt-laravel-echo/commit/5bd39f6)) 142 | - **deps-dev:** Bump @types/node from 22.13.13 to 22.13.16 ([30dccd9](https://github.com/manchenkoff/nuxt-laravel-echo/commit/30dccd9)) 143 | - **deps-dev:** Bump nuxt from 3.16.1 to 3.16.2 ([31bc195](https://github.com/manchenkoff/nuxt-laravel-echo/commit/31bc195)) 144 | - **deps-dev:** Bump @nuxt/kit from 3.16.1 to 3.16.2 ([1d47692](https://github.com/manchenkoff/nuxt-laravel-echo/commit/1d47692)) 145 | - **deps-dev:** Bump vite from 6.2.4 to 6.2.5 in the npm_and_yarn group ([5654b5c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/5654b5c)) 146 | - **playground:** Added example of echo interceptor ([5829aed](https://github.com/manchenkoff/nuxt-laravel-echo/commit/5829aed)) 147 | 148 | ### ❤️ Contributors 149 | 150 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 151 | 152 | ## v0.2.3 153 | 154 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.2...v0.2.3) 155 | 156 | ### 🏡 Chore 157 | 158 | - Upgraded nuxt packages ([6f5fd46](https://github.com/manchenkoff/nuxt-laravel-echo/commit/6f5fd46)) 159 | - Override for esbuild vulnerability ([21660b1](https://github.com/manchenkoff/nuxt-laravel-echo/commit/21660b1)) 160 | - Removed override for esbuild ([e2d2cfc](https://github.com/manchenkoff/nuxt-laravel-echo/commit/e2d2cfc)) 161 | 162 | ### ❤️ Contributors 163 | 164 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 165 | 166 | ## v0.2.2 167 | 168 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.1...v0.2.2) 169 | 170 | ### 🩹 Fixes 171 | 172 | - Use npm keys directly ([4aea843](https://github.com/manchenkoff/nuxt-laravel-echo/commit/4aea843)) 173 | - Use npm keys directly in release ([f154e8c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f154e8c)) 174 | 175 | ### 🏡 Chore 176 | 177 | - **deps-dev:** Bump @nuxt/devtools from 1.6.4 to 1.7.0 ([a6376f8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a6376f8)) 178 | - **deps-dev:** Bump @types/node from 22.10.2 to 22.10.3 ([c86d447](https://github.com/manchenkoff/nuxt-laravel-echo/commit/c86d447)) 179 | - **deps-dev:** Bump @typescript-eslint/eslint-plugin ([98e3e68](https://github.com/manchenkoff/nuxt-laravel-echo/commit/98e3e68)) 180 | - **deps-dev:** Bump nuxt from 3.14.1592 to 3.15.0 ([0a6f8c1](https://github.com/manchenkoff/nuxt-laravel-echo/commit/0a6f8c1)) 181 | - **deps-dev:** Bump @nuxt/test-utils from 3.15.1 to 3.15.4 ([8248584](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8248584)) 182 | - **deps-dev:** Bump eslint from 9.17.0 to 9.19.0 ([e4150f9](https://github.com/manchenkoff/nuxt-laravel-echo/commit/e4150f9)) 183 | - **deps-dev:** Bump @nuxt/schema from 3.15.0 to 3.15.4 ([46bef32](https://github.com/manchenkoff/nuxt-laravel-echo/commit/46bef32)) 184 | - **deps-dev:** Bump @typescript-eslint/eslint-plugin ([b3ad9cb](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b3ad9cb)) 185 | - **deps-dev:** Bump vitest in the npm_and_yarn group ([49ceadd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/49ceadd)) 186 | - **deps-dev:** Bump @types/node from 22.10.3 to 22.13.1 ([88402e5](https://github.com/manchenkoff/nuxt-laravel-echo/commit/88402e5)) 187 | - Upgraded package versions ([4177170](https://github.com/manchenkoff/nuxt-laravel-echo/commit/4177170)) 188 | - Simplified PR template ([a3a97e8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a3a97e8)) 189 | - Upgraded nuxt packages ([a576fd5](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a576fd5)) 190 | - **dev-deps:** Upgraded dependencies ([5e1044d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/5e1044d)) 191 | - **deps-dev:** Bump changelogen from 0.5.7 to 0.6.0 ([62b9c1e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/62b9c1e)) 192 | 193 | ### ❤️ Contributors 194 | 195 | - Manchenkoff ([@manchenkoff](https://github.com/manchenkoff)) 196 | 197 | ## v0.2.1 198 | 199 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.2.0...v0.2.1) 200 | 201 | ### 🚀 Enhancements 202 | 203 | - Add support for token authentication mode ([392a7c5](https://github.com/manchenkoff/nuxt-laravel-echo/commit/392a7c5)) 204 | 205 | ### 🩹 Fixes 206 | 207 | - Add sanctum token auth ([9b6f061](https://github.com/manchenkoff/nuxt-laravel-echo/commit/9b6f061)) 208 | - Add tokenStorage parameter into types ([65efc1a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/65efc1a)) 209 | 210 | ### 🏡 Chore 211 | 212 | - **deps-dev:** Bump nuxt from 3.14.159 to 3.14.1592 ([21aaee5](https://github.com/manchenkoff/nuxt-laravel-echo/commit/21aaee5)) 213 | - **deps-dev:** Bump @nuxt/schema from 3.14.159 to 3.14.1592 ([250b87d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/250b87d)) 214 | - **deps-dev:** Bump @types/node from 22.9.0 to 22.9.3 ([928b7af](https://github.com/manchenkoff/nuxt-laravel-echo/commit/928b7af)) 215 | - **deps-dev:** Bump @nuxt/devtools from 1.6.0 to 1.6.1 ([122220f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/122220f)) 216 | - **deps-dev:** Bump @nuxt/eslint-config from 0.7.0 to 0.7.2 ([fc530d4](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fc530d4)) 217 | - **deps-dev:** Bump eslint from 9.15.0 to 9.16.0 ([e145037](https://github.com/manchenkoff/nuxt-laravel-echo/commit/e145037)) 218 | - **deps-dev:** Bump vitest from 2.1.5 to 2.1.8 ([a030ddf](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a030ddf)) 219 | - **deps-dev:** Bump @typescript-eslint/eslint-plugin ([19f0489](https://github.com/manchenkoff/nuxt-laravel-echo/commit/19f0489)) 220 | - **deps-dev:** Bump @types/node from 22.9.3 to 22.10.1 ([ddcbc60](https://github.com/manchenkoff/nuxt-laravel-echo/commit/ddcbc60)) 221 | - **deps-dev:** Bump @nuxt/test-utils from 3.14.4 to 3.15.1 ([01f8535](https://github.com/manchenkoff/nuxt-laravel-echo/commit/01f8535)) 222 | - **deps-dev:** Bump @nuxt/devtools from 1.6.1 to 1.6.3 ([61374fd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/61374fd)) 223 | - **deps-dev:** Bump @types/node from 22.10.1 to 22.10.2 ([095a12e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/095a12e)) 224 | - **deps-dev:** Bump eslint from 9.16.0 to 9.17.0 ([28e2f1d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/28e2f1d)) 225 | - **deps-dev:** Bump @nuxt/devtools from 1.6.3 to 1.6.4 ([551db6c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/551db6c)) 226 | - **deps-dev:** Bump @nuxt/eslint-config from 0.7.2 to 0.7.3 ([741af10](https://github.com/manchenkoff/nuxt-laravel-echo/commit/741af10)) 227 | - **deps-dev:** Bump @typescript-eslint/eslint-plugin ([24a505f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/24a505f)) 228 | 229 | ### ❤️ Contributors 230 | 231 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 232 | - Kirill Petrov 233 | 234 | ## v0.2.0 235 | 236 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.1.0...v0.2.0) 237 | 238 | ### 🩹 Fixes 239 | 240 | - ⚠️ New laravel-echo typing system ([113e962](https://github.com/manchenkoff/nuxt-laravel-echo/commit/113e962)) 241 | 242 | ### 🏡 Chore 243 | 244 | - **deps-dev:** Bump @nuxt/devtools from 1.5.2 to 1.6.0 ([b8fb7c7](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b8fb7c7)) 245 | - **deps-dev:** Bump vitest from 2.1.2 to 2.1.3 ([8b4c78d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8b4c78d)) 246 | - **deps-dev:** Bump @types/node from 22.7.4 to 22.7.7 ([42915b8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/42915b8)) 247 | - **deps-dev:** Bump @nuxt/eslint-config from 0.5.7 to 0.6.0 ([794b98b](https://github.com/manchenkoff/nuxt-laravel-echo/commit/794b98b)) 248 | - **deps-dev:** Bump eslint from 9.12.0 to 9.13.0 ([e79e738](https://github.com/manchenkoff/nuxt-laravel-echo/commit/e79e738)) 249 | - **deps-dev:** Bump typescript from 5.5.4 to 5.6.3 ([81f2ae6](https://github.com/manchenkoff/nuxt-laravel-echo/commit/81f2ae6)) 250 | - **deps-dev:** Bump @nuxt/test-utils from 3.14.3 to 3.14.4 ([eae690c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/eae690c)) 251 | - **deps-dev:** Bump vitest from 2.1.3 to 2.1.4 ([7dc3af8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/7dc3af8)) 252 | - **deps-dev:** Bump @nuxt/eslint-config from 0.6.0 to 0.6.1 ([115ade7](https://github.com/manchenkoff/nuxt-laravel-echo/commit/115ade7)) 253 | - **deps-dev:** Bump vue-tsc from 2.1.6 to 2.1.10 ([b08b150](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b08b150)) 254 | - **deps-dev:** Bump @types/node from 22.7.7 to 22.8.7 ([c2077cd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/c2077cd)) 255 | - **deps-dev:** Bump eslint from 9.13.0 to 9.14.0 ([d69529f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d69529f)) 256 | - **deps-dev:** Bump nuxt from 3.13.2 to 3.14.159 ([00c2d69](https://github.com/manchenkoff/nuxt-laravel-echo/commit/00c2d69)) 257 | - **deps-dev:** Bump @nuxt/schema from 3.13.2 to 3.14.159 ([16225da](https://github.com/manchenkoff/nuxt-laravel-echo/commit/16225da)) 258 | - **deps-dev:** Bump @types/node from 22.8.7 to 22.9.0 ([8d8f006](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8d8f006)) 259 | - **deps-dev:** Bump @nuxt/eslint-config from 0.6.1 to 0.7.0 ([06232b7](https://github.com/manchenkoff/nuxt-laravel-echo/commit/06232b7)) 260 | - **deps-dev:** Bump vitest from 2.1.4 to 2.1.5 ([5c7dd75](https://github.com/manchenkoff/nuxt-laravel-echo/commit/5c7dd75)) 261 | - **deps-dev:** Bump eslint from 9.14.0 to 9.15.0 ([7238ff8](https://github.com/manchenkoff/nuxt-laravel-echo/commit/7238ff8)) 262 | - Install @typescript-eslint with a fix ([a794e58](https://github.com/manchenkoff/nuxt-laravel-echo/commit/a794e58)) 263 | 264 | #### ⚠️ Breaking Changes 265 | 266 | - ⚠️ New laravel-echo typing system ([113e962](https://github.com/manchenkoff/nuxt-laravel-echo/commit/113e962)) 267 | 268 | ### ❤️ Contributors 269 | 270 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 271 | 272 | ## v0.1.0 273 | 274 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.13...v0.1.0) 275 | 276 | ### 🚀 Enhancements 277 | 278 | - ⚠️ Use setter for ofetch headers ([9a0c84a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/9a0c84a)) 279 | 280 | ### 🏡 Chore 281 | 282 | - **deps-dev:** Bump typescript from 5.5.4 to 5.6.2 ([b7c136e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/b7c136e)) 283 | - **deps-dev:** Bump @nuxt/devtools from 1.5.0 to 1.5.1 ([4a74c3f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/4a74c3f)) 284 | - **deps-dev:** Bump @types/node from 22.5.5 to 22.7.4 ([eba951e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/eba951e)) 285 | - **deps-dev:** Bump eslint from 9.11.0 to 9.11.1 ([f147c57](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f147c57)) 286 | - ⚠️ Use nuxt 3.13 compatibility level ([1db6870](https://github.com/manchenkoff/nuxt-laravel-echo/commit/1db6870)) 287 | - **deps-dev:** Bump @nuxt/test-utils from 3.14.2 to 3.14.3 ([26201fd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/26201fd)) 288 | - **deps-dev:** Bump eslint from 9.11.1 to 9.12.0 ([764530c](https://github.com/manchenkoff/nuxt-laravel-echo/commit/764530c)) 289 | 290 | #### ⚠️ Breaking Changes 291 | 292 | - ⚠️ Use setter for ofetch headers ([9a0c84a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/9a0c84a)) 293 | - ⚠️ Use nuxt 3.13 compatibility level ([1db6870](https://github.com/manchenkoff/nuxt-laravel-echo/commit/1db6870)) 294 | 295 | ### ❤️ Contributors 296 | 297 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 298 | 299 | ## v0.0.13 300 | 301 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.12...v0.0.13) 302 | 303 | ### 🏡 Chore 304 | 305 | - **deps-dev:** Bump @nuxt/eslint-config from 0.5.4 to 0.5.5 ([87ea010](https://github.com/manchenkoff/nuxt-laravel-echo/commit/87ea010)) 306 | - **deps-dev:** Bump vue-tsc from 2.1.2 to 2.1.4 ([d76c06f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d76c06f)) 307 | - **deps-dev:** Bump @types/node from 22.5.1 to 22.5.2 ([163b111](https://github.com/manchenkoff/nuxt-laravel-echo/commit/163b111)) 308 | - **deps-dev:** Bump nuxt from 3.13.0 to 3.13.1 ([3beb22e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/3beb22e)) 309 | - **deps-dev:** Bump vue-tsc from 2.1.4 to 2.1.6 ([8f2f7b9](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8f2f7b9)) 310 | - **deps-dev:** Bump eslint from 9.9.1 to 9.10.0 ([8d1d333](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8d1d333)) 311 | - **deps-dev:** Bump @types/node from 22.5.2 to 22.5.4 ([ab315be](https://github.com/manchenkoff/nuxt-laravel-echo/commit/ab315be)) 312 | - **deps-dev:** Bump vitest from 2.0.5 to 2.1.1 ([032dcff](https://github.com/manchenkoff/nuxt-laravel-echo/commit/032dcff)) 313 | - **deps-dev:** Bump @nuxt/test-utils from 3.14.1 to 3.14.2 ([616755d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/616755d)) 314 | - **deps-dev:** Bump @nuxt/schema from 3.13.0 to 3.13.2 ([d811a30](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d811a30)) 315 | - Upgrade nuxt dependencies ([4b5115d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/4b5115d)) 316 | 317 | ### 🤖 CI 318 | 319 | - Added prerelease pipeline ([12bdfc0](https://github.com/manchenkoff/nuxt-laravel-echo/commit/12bdfc0)) 320 | 321 | ### ❤️ Contributors 322 | 323 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 324 | 325 | ## v0.0.12 326 | 327 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.11...v0.0.12) 328 | 329 | ### 🏡 Chore 330 | 331 | - Upgraded dependencies ([d9d1574](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d9d1574)) 332 | 333 | ### 🤖 CI 334 | 335 | - Disabled docs workflow ([807625f](https://github.com/manchenkoff/nuxt-laravel-echo/commit/807625f)) 336 | 337 | ### ❤️ Contributors 338 | 339 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 340 | 341 | ## v0.0.11 342 | 343 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.10...v0.0.11) 344 | 345 | ### 🚀 Enhancements 346 | 347 | - Created nuxt content for docs ([f6c1706](https://github.com/manchenkoff/nuxt-laravel-echo/commit/f6c1706)) 348 | 349 | ### 📖 Documentation 350 | 351 | - Added Vite config to readme ([71a06aa](https://github.com/manchenkoff/nuxt-laravel-echo/commit/71a06aa)) 352 | 353 | ### 🏡 Chore 354 | 355 | - Upgraded package manager version ([eea769a](https://github.com/manchenkoff/nuxt-laravel-echo/commit/eea769a)) 356 | 357 | ### 🤖 CI 358 | 359 | - Added github pages deployment workflow ([d836bdd](https://github.com/manchenkoff/nuxt-laravel-echo/commit/d836bdd)) 360 | 361 | ### ❤️ Contributors 362 | 363 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 364 | 365 | ## v0.0.10 366 | 367 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.9...v0.0.10) 368 | 369 | ### 🩹 Fixes 370 | 371 | - Added universal import for pusher module ([0061f35](https://github.com/manchenkoff/nuxt-laravel-echo/commit/0061f35)) 372 | 373 | ### ❤️ Contributors 374 | 375 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 376 | 377 | ## v0.0.9 378 | 379 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.8...v0.0.9) 380 | 381 | ### 🩹 Fixes 382 | 383 | - Another try on implicit pusher import ([ed7d112](https://github.com/manchenkoff/nuxt-laravel-echo/commit/ed7d112)) 384 | 385 | ### ❤️ Contributors 386 | 387 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 388 | 389 | ## v0.0.8 390 | 391 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.7...v0.0.8) 392 | 393 | ### 🩹 Fixes 394 | 395 | - Rolled back to basic import ([fb03d75](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fb03d75)) 396 | 397 | ### ❤️ Contributors 398 | 399 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 400 | 401 | ## v0.0.7 402 | 403 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.6...v0.0.7) 404 | 405 | ### 🩹 Fixes 406 | 407 | - Changed pusher-js to worker mode ([1c6816e](https://github.com/manchenkoff/nuxt-laravel-echo/commit/1c6816e)) 408 | 409 | ### ❤️ Contributors 410 | 411 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 412 | 413 | ## v0.0.6 414 | 415 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.5...v0.0.6) 416 | 417 | ## v0.0.5 418 | 419 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.4...v0.0.5) 420 | 421 | ### 🩹 Fixes 422 | 423 | - Import pusher on demand ([47485de](https://github.com/manchenkoff/nuxt-laravel-echo/commit/47485de)) 424 | 425 | ### ❤️ Contributors 426 | 427 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 428 | 429 | ## v0.0.4 430 | 431 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.3...v0.0.4) 432 | 433 | ### 🩹 Fixes 434 | 435 | - Rolled back to pusher 8.3 ([fa42bdf](https://github.com/manchenkoff/nuxt-laravel-echo/commit/fa42bdf)) 436 | 437 | ### ❤️ Contributors 438 | 439 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 440 | 441 | ## v0.0.3 442 | 443 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.2...v0.0.3) 444 | 445 | ### 🩹 Fixes 446 | 447 | - Use lazy load for pusher ([3083116](https://github.com/manchenkoff/nuxt-laravel-echo/commit/3083116)) 448 | 449 | ### ❤️ Contributors 450 | 451 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 452 | 453 | ## v0.0.2 454 | 455 | [compare changes](https://github.com/manchenkoff/nuxt-laravel-echo/compare/v0.0.1...v0.0.2) 456 | 457 | ### 🩹 Fixes 458 | 459 | - Updated dependency list ([97904d7](https://github.com/manchenkoff/nuxt-laravel-echo/commit/97904d7)) 460 | 461 | ### ❤️ Contributors 462 | 463 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 464 | 465 | ## v0.0.1 466 | 467 | 468 | ### 🏡 Chore 469 | 470 | - Initial module structure ([7c80b3d](https://github.com/manchenkoff/nuxt-laravel-echo/commit/7c80b3d)) 471 | - **release:** V0.0.1 ([8d134bf](https://github.com/manchenkoff/nuxt-laravel-echo/commit/8d134bf)) 472 | - **release:** V0.0.1 ([0e8e53b](https://github.com/manchenkoff/nuxt-laravel-echo/commit/0e8e53b)) 473 | 474 | ### ❤️ Contributors 475 | 476 | - Changelog_action ([@manchenkoff](http://github.com/manchenkoff)) 477 | - Manchenkoff ([@manchenkoff](http://github.com/manchenkoff)) 478 | 479 | --------------------------------------------------------------------------------