Dashboard

Nuxt SDK

@sentriq/nuxt is a real Nuxt module built on @sentriq/vue — it never reimplements the plugin/composable, only wires them into Nuxt's own module, runtime-config, and auto-import systems. Tested against Nuxt 4; the module API (@nuxt/kit) is the same across Nuxt 3 and 4, but Nuxt 3 itself was not separately tested this phase.

Install

npm install @sentriq/nuxt

nuxt.config.ts

export default defineNuxtConfig({
  modules: ['@sentriq/nuxt'],

  sentriq: {
    publicKey: process.env.NUXT_PUBLIC_SENTRIQ_PUBLIC_KEY,
  },
});
runtimeConfig.public — public key only, by construction
The module merges your sentriq config directly into runtimeConfig.public.sentriq, which Nuxt serializes into every page's HTML payload by design — anything placed there is visible to any browser. This is safe here specifically because the accepted options (publicKey/apiUrl/timeoutMs/debug) are the exact same shape @sentriq/browser's Sentriq.init() accepts — there is no secret-key field for this module to ever leak, and there never will be unless this module's options type changes to add one (it doesn't today). Never pass a secret key (sec_...) here.

useSentriq()

<template>
  <button :disabled="!ready" @click="track('login')">Log in</button>
</template>

<script setup lang="ts">
// no import needed — useSentriq is auto-imported by the module
const { track, status, ready } = useSentriq();
</script>

Identical shape to @sentriq/vue's own useSentriq() — this module re-exports it unchanged and registers it as a Nuxt auto-import, so there is exactly one composable implementation, not a parallel Nuxt-specific one.

SSR / client boundary

The plugin that installs @sentriq/vue onto Nuxt's own nuxtApp.vueApp runs universally — both the server and client Nuxt app instances install it — deliberately not client-only, so useSentriq() resolves to a real context (status: 'idle', every button correctly rendered disabled) during a server render too, instead of throwing on every page load. The actual guarantee that Sentriq.init() — and therefore the network — is never touched server-side lives inside @sentriq/vue's own plugin, which checks typeof window === 'undefined' before doing anything. Verified with a real server-rendered fixture: the response HTML shows status: idle and a disabled button, and hydration on the client updates it to status: ready with no console errors or hydration warnings.

Navigation / pageviews

This module does not track page views on route changes — @sentriq/browser has no automatic pageview tracking of its own to preserve, so adding one here would be a new, Nuxt-specific behavior rather than exposing an existing one. Call track('page_view') (or identify(), its existing alias) from a route middleware or layout yourself if you want this.

Version compatibility

Nuxt ^3.9.0 || ^4.0.0 (peer range); Nuxt 4.4.x is what this phase actually built, typechecked, and ran against a real server-rendered fixture. Nuxt 3 was not independently tested — the module API this package uses (@nuxt/kit's defineNuxtModule/addPlugin/addImportsDir) is stable across both major versions, but that is not the same claim as "tested on Nuxt 3."