Nuxt SDK

@logtide/nuxt is a zero-config Nuxt module that auto-initializes LogTide on both server and client with runtime config injection.

Installation

npm install @logtide/nuxt

Quick Start

Add the module to your nuxt.config.ts:

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

  logtide: {
    dsn: process.env.LOGTIDE_DSN,
    service: 'nuxt-app',
    environment: process.env.NODE_ENV,
  },
});

That's it. The module automatically initializes LogTide on both server and client, captures errors, and provides composables for logging.

Configuration

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

  logtide: {
    // Required
    dsn: process.env.LOGTIDE_DSN,

    // Recommended
    service: 'nuxt-app',
    environment: process.env.NODE_ENV,
    release: '1.0.0',

    // Client-side DSN (if different from server)
    clientDsn: process.env.NUXT_PUBLIC_LOGTIDE_DSN,

    // Enable/disable client-side capture (default: true)
    clientEnabled: true,

    // Enable/disable server-side capture (default: true)
    serverEnabled: true,

    // Tracing
    tracesSampleRate: 1.0,
  },
});

Server-Side Usage

// server/api/users/[id].get.ts
import { hub } from '@logtide/core';

export default defineEventHandler(async (event) => {
  const id = getRouterParam(event, 'id');

  hub.captureLog('info', 'Fetching user', { userId: id });

  try {
    const user = await getUserById(id);
    return user;
  } catch (error) {
    hub.captureError(error, { userId: id });
    throw createError({ statusCode: 500, message: 'Failed to fetch user' });
  }
});

Client-Side Usage

<script setup>
import { useLogtide } from '#imports';

const logtide = useLogtide();

async function handleSubmit() {
  try {
    logtide.addBreadcrumb({
      category: 'ui',
      message: 'Form submitted',
    });

    await $fetch('/api/submit', { method: 'POST', body: formData });
    logtide.captureLog('info', 'Form submitted successfully');
  } catch (error) {
    logtide.captureError(error);
  }
}
</script>

Runtime Config

The module injects configuration via Nuxt runtime config, so you can override settings with environment variables at deploy time:

# .env
LOGTIDE_DSN=https://[email protected]
NUXT_PUBLIC_LOGTIDE_DSN=https://[email protected]

API Reference

Export	Description
`@logtide/nuxt` (module)	Nuxt module — auto-initializes server + client
`useLogtide()`	Composable — access LogTide client in components
`logtide` config key	nuxt.config.ts configuration key

See the JavaScript SDK core docs for the full @logtide/core API.

Edit this page on GitHub