skills.rest
PostHog
PostHogOFFICIAL
Explore all skills by this author →
Website𝕏@PostHogGitHub

integration-nuxt-4

Integrate PostHog analytics into Nuxt 4 applications with client and server tracking.

58|5|Updated Jan 19, 2026
Search Tags:#analytics#client-side#server-side#posthog#nuxt#error-tracking
One-click install
npx skills add https://github.com/PostHog/skills --skill integration-nuxt-4
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: integration-nuxt-4
Source: https://github.com/PostHog/skills/tree/main/skills/posthog/integration/skills/nuxt-4
Command: npx skills add https://github.com/PostHog/skills --skill integration-nuxt-4

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Nuxt 4 projects often struggle to implement reliable analytics, error tracking, and cross-boundary data correlation. This skill provides a ready-to-use PostHog Nuxt integration that handles client and server-side tracking, automatic error capture, and source map support.

Core Features & Use Cases

  • Client-side and server-side PostHog integration via the @posthog/nuxt module.
  • Automatic error tracking for Nuxt/Nitro and inclusive event capture for backend routes using a shared server PostHog client.
  • Structured configuration guidance and references for Nuxt 4 projects needing robust analytics and correlation between frontend and backend events.

Quick Start

Install and configure the PostHog Nuxt integration in a Nuxt 4 project by adding @posthog/nuxt and setting runtimeConfig.posthog values.

Frequently Asked Questions about integration-nuxt-4

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I integrate PostHog analytics into a Nuxt 4 application?▼

To integrate PostHog analytics into a Nuxt 4 application, add the @posthog/nuxt module and configure the runtimeConfig.posthog values for your public key and host to enable client-side and server-side tracking.

Does PostHog support both client-side and server-side event tracking in Nuxt?▼

Yes, PostHog supports both client-side and server-side tracking in Nuxt by using the @posthog/nuxt module alongside a shared server PostHog client to capture backend route events automatically.

How does error tracking work with the PostHog Nuxt module?▼

Error tracking with the PostHog Nuxt module works by automatically capturing client-side errors and Nuxt or Nitro server errors, while establishing tracing headers to correlate frontend and backend events.

What environment variables do I need to configure for PostHog in Nuxt 4?▼

You need to configure environment variables for runtimeConfig.posthog, specifically setting the publicKey and host values to successfully initialize the PostHog client in your Nuxt 4 project.

Can I correlate frontend and backend events using PostHog in Nuxt?▼

Yes, you can correlate frontend and backend events because the integration establishes tracing headers across boundaries, allowing you to link client-side analytics with server-side captures from the shared PostHog client.

Related Skills

Explore More Software Engineering Skills→
PostHogPostHog
58

error-tracking-nuxt

Integrate PostHog error tracking into Nuxt 3+ apps with source-map uploads.

Official
Intermediate
LucaDeLeoLucaDeLeo
1

integration-tanstack-start

Integrate PostHog analytics into TanStack Start apps for client and server event tracking.

Community
Advanced
clerkclerk
66

clerk-nuxt-patterns

Protects Nuxt 3 apps with Clerk authentication middleware and Nitro server route guards.

Official
Intermediate
nathanielcrowell12-specnathanielcrowell12-spec

posthog

Implement PostHog client- and server-side event tracking with TypeScript schemas.

Community
Intermediate