nuxt-frogger
🐸 Frogger
The zero-setup logger for Nuxt
Log and trace from anywhere in your Nuxt applications. Server to client, client to server, to external services and back again. Install Frogger - add it as a module, and it just works. Automatically batches and sends logs to the server. No matter where you make a log, you'll find it in the same place.
A bare install logs to the console only. Add persistent destinations declaratively with the transport factories — rotated JSON-lines files with fileTransport(), any HTTP ingest with httpTransport(), or a nuxt-observe deployment with observeTransport():
// frogger.config.ts
import { defineFroggerOptions, fileTransport, observeTransport } from '#frogger/config';
export default defineFroggerOptions({
transports: [
fileTransport(), // logs/ on disk
observeTransport({ url: 'https://observe.app.com', key }) // forward to observe
],
});
Metrics (opt-in)
Frogger can also collect metrics — a fully separate pipeline from logging,
off by default. Turn it on with metrics: true to auto-collect Web Vitals
(LCP/CLS/INP/FCP/TTFB) and a per-batch device/network envelope:
// frogger.config.ts
import { defineFroggerOptions } from '#frogger/config';
export default defineFroggerOptions({
metrics: true,
});
Metrics can be shipped to a nuxt-observe deployment with a single transport entry - relayed from your server, or sent directly from the browser on static sites:
import { defineFroggerOptions, metricObserveTransport } from '#frogger/config';
export default defineFroggerOptions({
metrics: {
transports: [metricObserveTransport({ url: 'https://observe.example.com', key: 'obsk_...' })],
},
});
Metrics are stored raw and aggregated on read, carry an optional trace exemplar linking each measurement to the page's trace, and never touch the logging pipeline. See the Metrics guide for the config reference and cardinality model.
Installation
Automatic Installation
To install and register the latest version of Frogger, navigate to your Nuxt project and run the following command:
pnpm:
pnpm dlx nuxi@latest module add nuxt-frogger
npm:
npx nuxi@latest module add nuxt-frogger
Manual Installation
Does the command above not work? You can install Frogger and register it manually:
pnpm:
pnpm add nuxt-frogger
npm:
npm install nuxt-frogger
Register the Module
Add 'nuxt-frogger' to modules in your nuxt.config.ts file:
export default defineNuxtConfig({
modules: [
'nuxt-frogger'
]
})
Migrating to 0.2.0 (breaking)
Most applications need no code changes. The full page, with what to check and how to restore each old default, is at docs/migration/0.2.md.
The headlines:
preset: 'standard'and'full'now actually redact. They documented redaction and resolved to a scrubber with zero rules. They now seedRECOMMENDED_RULES.- Frogger no longer takes over host shutdown. The
SIGTERM/SIGINThandlers that calledprocess.exit(0)are off by default (errorCapture.server.takeoverSignalsrestores them). - Error capture no longer ships secrets.
includeHeaders,includeComponentPropsandincludeComponentOuterHTMLall default tofalse. - Rate limiting ignores forwarding headers by default. Set
rateLimit.trustProxyif you run behind a proxy. lvlchanged forverboseandsilent— they were ±Infinity, which serialises tonull. Rows also gainedsev, the OTel SeverityNumber.trace.parentIdis nowtrace.parentSpanId, and each logger owns one stablespanIdfor its lifetime.- Removed:
LoggerObject.tagsand its live-log filter (written by no code path), the dead websocket query scaffold, andpublic.serverModule. - Nuxt 4 is a declared peer dependency.
Already shipped in 0.1.x, and still worth knowing:
- File logging is not on by default. A bare install logs to the console only. Add
fileTransport()totransports. - The top-level
filemodule option was removed. Move its settings intofileTransport({ ... }). public.endpointacceptsfalseto disable the browser POST to your app's own ingest route while keeping the server route registered.- Plain
{ url, apiKey }transport objects still work (an untagged entry is treated ashttpTransport(...)). HttpTransportretry semantics were fixed. Failures used to be silently swallowed; they now retry (429/5xx/network) with jittered exponential backoff and drop deterministically on a non-429 4xx.
Related Packages
Nuxt module for BetterStack logging - send logs from both SSR and client-side to...
A Nuxt module for observability: debug server, health checks, and Prometheus met...
Fixwire SDK for Nuxt: a module for the browser and the server, with Vue's and Ni...
Version History
| Version | Released | Vue | License |
|---|---|---|---|
| 0.1.29 | ^3.0 | MIT | |
| 0.1.28 | ^3.0 | MIT | |
| 0.1.27 | ^3.0 | MIT | |
| 0.1.26 | ^3.0 | MIT | |
| 0.1.25 | ^3.0 | MIT | |
| 0.1.24 | ^3.0 | MIT | |
| 0.1.23 | ^3.0 | MIT | |
| 0.1.22 | ^3.0 | MIT | |
| 0.1.21 | ^3.0 | MIT | |
| 0.1.20 | ^3.0 | MIT | |
| 0.1.19 | ^3.0 | MIT | |
| 0.1.18 | ^3.0 | MIT | |
| 0.1.17 | ^3.0 | MIT | |
| 0.1.16 | ^3.0 | MIT | |
| 0.1.15 | ^3.0 | MIT | |
| 0.1.14 | ^3.0 | MIT | |
| 0.1.13 | ^3.0 | MIT | |
| 0.1.12 | ^3.0 | MIT | |
| 0.1.11 | ^3.0 | MIT | |
| 0.1.10 | ^3.0 | MIT | |
| 0.1.9 | ^3.0 | MIT | |
| 0.1.8 | ^3.0 | MIT | |
| 0.1.7 | ^3.0 | MIT | |
| 0.1.6 | ^3.0 | MIT | |
| 0.1.5 | ^3.0 | MIT | |
| 0.1.4 | ^3.0 | MIT | |
| 0.1.3 | ^3.0 | MIT | |
| 0.1.2 | ^3.0 | MIT | |
| 0.1.1 | ^3.0 | MIT | |
| 0.1.0 | ^3.0 | MIT |
Showing the latest 30 of 32. See every release on npm