Features

• Nuxt Module — zero-config setup via nuxt.config.ts
• Server-side request tracing via Nitro lifecycle hooks
• Vue error handler for client-side error capture
• Navigation tracking as breadcrumbs on the client
• W3C Trace Context propagation (traceparent)
• Runtime config injection (server + public)
• Full TypeScript support with strict types

Installation

npm install @logtide/nuxt
# or
pnpm add @logtide/nuxt
# or
yarn add @logtide/nuxt

Quick Start

Add the module to your nuxt.config.ts:

// nuxt.config.ts
export default defineNuxtConfig({
  modules: ['@logtide/nuxt'],

  logtide: {
    dsn: 'https://[email protected]',
    // Or use apiUrl + apiKey instead of dsn:
    // apiUrl: 'https://your-instance.com',
    // apiKey: 'lp_your_key',
    service: 'my-nuxt-app',
    environment: 'production',
    release: '1.0.0',
  },
});

That's it. The module automatically:

1. Registers a Nitro server plugin that traces every request and captures errors
2. Registers a Vue client plugin that captures Vue errors and tracks navigation

Configuration

All options are set in nuxt.config.ts under the logtide key:

| Option | Type | Default | Description | |--------|------|---------|-------------| | dsn | string | required | DSN string: https://lp_KEY@host/PROJECT | | service | string | 'nuxt-app' | Service name for log attribution | | environment | string | — | Environment (e.g. production, staging) | | release | string | — | Release / version identifier | | debug | boolean | false | Enable debug logging |

How It Works

Server (Nitro)

The server plugin hooks into Nitro's lifecycle:

• request — creates a trace span, extracts incoming traceparent, stores context on the event
• afterResponse — finishes the span as ok
• error — finishes the span as error and captures the error with full context

Client (Vue)

The client plugin:

• Sets up vueApp.config.errorHandler to capture Vue component errors
• Tracks page:start and page:finish hooks as navigation breadcrumbs
• Reads configuration from Nuxt runtime config (public)

Runtime Config

The module injects LogTide configuration into Nuxt's runtime config, making it available in both server and client plugins:

// Server-side
const config = useRuntimeConfig().logtide;

// Client-side
const config = useRuntimeConfig().public.logtide;

Type Support

import type { ModuleOptions } from '@logtide/nuxt';

The ModuleOptions interface extends ClientOptions from @logtide/types (excluding integrations and transport which are configured automatically).

License

MIT License - see LICENSE for details.

Links

• LogTide Website
• Documentation
• GitHub