Scripts

Plausible Analytics

Plausible Analytics is a privacy-friendly analytics solution for Nuxt Apps, allowing you to track your website's traffic without compromising your users' privacy.

Plausible Analytics

View source

Nuxt Config Setup

Add this to your nuxt.config.ts to load Plausible Analytics globally. Alternatively you can use the useScriptPlausibleAnalytics composable for more control.

export default defineNuxtConfig({
  scripts: {
    registry: {
      plausibleAnalytics: {
        domain: 'example.com',
        trigger: 'onNuxtReady',
      }
    }
  }
})

This config automatically enables first-party mode (bundle + proxy). See below to customise.

useScriptPlausibleAnalytics()

The useScriptPlausibleAnalytics composable lets you have fine-grain control over when and how Plausible Analytics is loaded on your site.

const { proxy } = useScriptPlausibleAnalytics()

proxy.plausible('conversion', { props: { value: 1 } })

Please follow the Registry Scripts guide to learn more about advanced usage.

First-Party Mode: Privacy Focused Proxy

No extra config needed. The script is bundled from your domain (faster loads, no extra DNS lookup) and runtime requests are reverse-proxied through your server with automatic anonymisation (user IPs stay hidden from Plausible Analytics, works with ad blockers). Learn more.

Mode
Bundle Proxy Partytown
Privacy
User IP addresses are anonymised. Other request data passes through.
export default defineNuxtConfig({
  scripts: {
    // ✅ First-party mode: bundled + proxied
    registry: {
      plausibleAnalytics: {
        domain: 'example.com',
        trigger: 'onNuxtReady',
      },
    },
  },
})

Example

Using Plausible Analytics in a component with the proxy to send events .

<script setup lang="ts">
const { proxy } = useScriptPlausibleAnalytics()

// noop in development, ssr
// just works in production, client
function handleAction() {
  proxy.plausible('conversion', { props: { value: 1 } })
}
</script>

<template>
  <div>
    <button @click="handleAction">
      Send Event
    </button>
  </div>
</template>

Self-hosted Plausible

If you use a self-hosted version of Plausible, provide an explicit src for the script so that the browser sends API events to the correct endpoint.

useScriptPlausibleAnalytics({
  scriptInput: {
    src: 'https://my-self-hosted-plausible.io/js/script.js'
  }
})

Note: Find the scriptId in your Plausible dashboard under Site Installation in your site settings.

Extracting your Script ID:

Plausible provides you with a script tag like this:

<script async src="https://plausible.io/js/pa-gYyxvZhkMzdzXBAtSeSNz.js"></script>

Your scriptId is the part after pa- and before .js:

scriptId: 'gYyxvZhkMzdzXBAtSeSNz'
//         ^^^^^^^^^^^^^^^^^^^^^^^
//         Extract from: pa-{scriptId}.js
export interface PlausibleAnalyticsOptions {
  /**
   * Unique script ID for your site (recommended - new format as of October 2025)
   * Get this from your Plausible dashboard under Site Installation
   *
   * Extract it from your Plausible script URL:
   * ```
   * <script src="https://plausible.io/js/pa-gYyxvZhkMzdzXBAtSeSNz.js"></script>
   *                                       ^^^^^^^^^^^^^^^^^^^^^^^^^^
   *                                       scriptId: 'gYyxvZhkMzdzXBAtSeSNz'
   * ```
   * @example 'gYyxvZhkMzdzXBAtSeSNz'
   */
  scriptId?: string
  /**
   * Your site domain
   * @deprecated Use `scriptId` instead (new October 2025 format)
   * @example 'example.com'
   */
  domain?: string
  /**
   * Script extensions for additional features
   * @deprecated Use init options like `hashBasedRouting`, `captureOnLocalhost`, etc. instead (new October 2025 format)
   */
  extension?: 'hash' | 'outbound-links' | 'file-downloads' | 'tagged-events' | 'revenue' | 'pageview-props' | 'compat' | 'local' | 'manual' | Array<'hash' | 'outbound-links' | 'file-downloads' | 'tagged-events' | 'revenue' | 'pageview-props' | 'compat' | 'local' | 'manual'>
  /** Custom properties to track with every pageview */
  customProperties?: Record<string, any>
  /** Custom tracking endpoint URL */
  endpoint?: string
  /** Configure file download tracking */
  fileDownloads?: {
    /** File extensions to track (default: pdf, xlsx, docx, txt, rtf, csv, exe, key, pps, ppt, pptx, 7z, pkg, rar, gz, zip, avi, mov, mp4, mpeg, wmv, midi, mp3, wav, wma, dmg) */
    fileExtensions?: string[]
  }
  /** Enable hash-based routing for single-page apps */
  hashBasedRouting?: boolean
  /** Set to false to manually trigger pageviews */
  autoCapturePageviews?: boolean
  /** Enable tracking on localhost */
  captureOnLocalhost?: boolean
  /** Enable form submission tracking */
  trackForms?: boolean
}