Introduction

nuxt-tawk-to is a lightweight Nuxt module that integrates the Tawk.to live chat widget into your Nuxt application in seconds. It works with both Nuxt 3 and Nuxt 4.

It injects the Tawk.to script automatically and provides a fully typed, SSR-safe useTawk() composable with reactive state, actions, getters, event listeners, and setters — all auto-imported.

Important links:

Key Features

• useTawk() Composable — Auto-imported composable with full Tawk.to API access.
• Reactive State — isHidden, isMinimized, isMaximized, status, unreadCount as Vue refs that update automatically.
• Event Listeners — Subscribe to any Tawk.to event; each listener returns a cleanup function for zero memory leaks.
• Full TypeScript — All types exported via nuxt-tawk-to/types subpath.
• SSR Safe — Script injection and all API calls are client-side only.
• Zero Config — Managed entirely from nuxt.config.ts.
• Nuxt 3 & 4 Compatible

Migrating from v1

Version 2 removes the Vue provide/inject pattern. Replace all inject(...) calls with the new composable:

// ❌ v1
const toggle = inject<() => void>('toggle')

// ✅ v2
const { toggle } = useTawk()

No plugin registration changes are required. Just update your component code and enjoy reactive state out of the box.