Skip to content

Install on Nuxt

Declare the tag once in nuxt.config so it is server-rendered into the head of every page of your Nuxt app.

Nuxt builds the document head from your config, so the tag goes there once and appears on every page, server-rendered and client-rendered alike.

Where it goes

Add a script entry under app.head in nuxt.config.ts.

nuxt.config.ts
export default defineNuxtConfig({
  app: {
    head: {
      script: [
        {
          defer: true,
          src: 'https://statsy.co/js/script.js',
          'data-website-id': 'ws_XXXXXXXX',
          'data-domain': 'yourstartup.com',
        },
      ],
    },
  },
});

A useHead call inside a page component would work too, but only for that page. Config is the one place that covers the whole app.

Confirm it works

Deploy and open the site. Live shows the visitor. View source on a server-rendered page: the tag should be in the HTML that arrives, not added later by JavaScript.

Do not add it twice

If you already had the tag in a layout or in a useHead call, remove it before adding the config entry. Nuxt happily renders both, and two tags mean two pageviews per visit. Route changes handled by Vue Router are tracked automatically, so no extra plugin is needed. See Single-page apps and route changes.

Last updated · Markdown version