Nuxt monitoring across the client and the Nitro server
One Nuxt module that covers both halves of your app: server requests wrapped in http.server spans automatically, client route changes traced as navigation spans, and SSR trace meta tags stitching the two together. Add the module to nuxt.config.ts and the whole request path becomes visible.
Why Nuxt apps need real monitoring
Nuxt apps fail on two fronts. A composable throws in the browser and the console message dies with the tab; a Nitro server route fails and the only trace is a 500 in your access logs. When the two halves are monitored separately — or not at all — a single user-facing failure turns into an archaeology project: was it the client, the server, or the handoff between them?
AllStak's Nuxt module monitors both halves as one system. Add @allstak/nuxt to your modules and set the public runtime config — server requests are wrapped in http.server spans automatically, client route changes open navigation spans, and SSR trace meta tags stitch client and server traces together with no manual call. Capture handled errors via useAllStak on the client and the AllStak object on the server. Upload source maps for readable traces, watch session replay for the browser side, and see it all next to your logs and uptime on one platform.
Full-stack Nuxt monitoring
From a route change in the browser to the Nitro handler behind it, AllStak covers your Nuxt app across every layer.
Error tracking
Capture client-side errors via the useAllStak composable from @allstak/nuxt/client, and server-side ones via the AllStak object from @allstak/nuxt/server — both land in the same issue stream.
Nitro server monitoring
Server requests are wrapped in an http.server span automatically — no manual call required — so every API route and SSR render is accounted for.
Stitched client–server traces
Client route changes open a navigation span, and SSR trace meta tags stitch client and server traces together — one connected picture of each request.
Session replay
See what the user actually did before the error — clicks, navigation, and the moment it broke — with privacy masking so sensitive input never leaves the browser.
Source maps
Upload source maps and minified production stack traces resolve to your original code — file, line, and function — so the fix starts immediately.
Alerts & incidents
Get notified the moment a new error appears or an old one spikes — before the support tickets arrive, not after.
Add AllStak in minutes
Install from npm (peer: nuxt@^3.7 || ^4), add the module, and set public runtime config in nuxt.config.ts — both halves are monitored from there.
npm install @allstak/nuxt
// nuxt.config.ts
export default defineNuxtConfig({
modules: ['@allstak/nuxt'],
runtimeConfig: {
public: {
allstak: {
apiKey: process.env.ALLSTAK_API_KEY,
environment: process.env.NODE_ENV,
release: process.env.APP_VERSION,
},
},
},
});Use the /client and /server subpath imports in the right context — useAllStak from @allstak/nuxt/client, the AllStak object from @allstak/nuxt/server — and tune tracesSampleRate under the allstak config key. full setup guide · SDK reference.
What you see in AllStak
Error detail with full context
Open any issue to a readable stack trace (via source maps), the breadcrumbs leading up to it, and the release it shipped in — whether it came from the browser or the Nitro server.
One trace from click to server
Navigation spans on the client connect to http.server spans on Nitro through SSR trace meta tags — so a slow page points at the exact half that's slow.
Session replay of the failure
Watch the user's session around the error — what they clicked, where they navigated, and what the page looked like when it broke.
Unified real-time dashboard
Client errors, server errors, logs, and uptime side by side — one dashboard, in English or Arabic, for the whole team.
Why teams pick AllStak for Nuxt
- One module covers client and Nitro server — no separate browser and server setups to keep in sync.
- Server spans, navigation spans, and SSR trace stitching are automatic — no manual instrumentation calls.
- Session replay and source maps turn vague bug reports into watchable, readable evidence.
- All-in-one platform — errors, logs, traces, and uptime with one bill instead of four tools.
- Predictable SAR pricing with a genuine free tier — start without a credit card.
- Data stays in Saudi Arabia, with an English and Arabic dashboard for the whole team.
Nuxt monitoring FAQ
How do I add error tracking to a Nuxt app?
Install @allstak/nuxt from npm, add it to modules in nuxt.config.ts, and set apiKey, environment, and release under runtimeConfig.public.allstak. From there, capture handled errors with useAllStak on the client and the AllStak object on the server — the setup guide covers both.
Which Nuxt versions are supported?
The module targets Nuxt 3 and 4 (peer: nuxt@^3.7 || ^4). If you're on plain Vue without Nuxt, AllStak also ships a dedicated Vue 3 plugin.
Does AllStak monitor the Nitro server too?
Yes. Server requests are wrapped in an http.server span automatically, you can capture errors and add breadcrumbs via the AllStak object from @allstak/nuxt/server, and SSR trace meta tags connect the server's work to the client navigation that triggered it.
Is AllStak free for Nuxt?
Yes. AllStak has a free tier you can start on without a credit card, and predictable SAR pricing as you grow. The Nuxt module itself is free to use.
Is AllStak a Sentry alternative for Nuxt?
Yes. You get Nuxt error tracking with source maps, session replay, and stitched client–server traces like Sentry, plus logs, uptime, and infrastructure monitoring on the same platform — one SAR bill and data stored in Saudi Arabia. You control overhead with client and server tracesSampleRate under the allstak config key.
Explore more
Start monitoring your Nuxt app today
Add the module, set the runtime config, deploy — and watch client and server errors, traces, and sessions arrive in one dashboard. Start free — no credit card required.