Installation - Nuxt
Before you start, create a project in the DockRay panel. Its settings hold the project token - the public identifier that goes into the ingest URL - and the API keys tab is where you generate a private key. The key is shown once, when it is generated: DockRay stores only its hash. If you do not have a project yet, start with Getting Started.
Requirements
- Nuxt 3 or 4,
- Node.js 18 or newer,
- npm.
Installing the module
npm install @dockcodes/dock-ray-nuxt
Registration and credentials
In nuxt.config.ts:
export default defineNuxtConfig({
modules: ['@dockcodes/dock-ray-nuxt'],
ray: {
tracesSampleRate: 0.2,
browser: { enabled: false },
},
});
In the environment:
NUXT_RAY_TOKEN=project-token
NUXT_RAY_PRIVATE_KEY=project-private-key
Nuxt maps NUXT_RAY_* variables onto runtimeConfig.ray on its own - that is its own built-in convention, and it keeps credentials out of nuxt.config.ts and out of git. The module keeps them only in the private half of the runtime config: anything under runtimeConfig.public gets serialised into the client bundle, and a project key there would be a published key. Without a token and a key the module loads and sends nothing.
What the module registers on its own
Adding the module to modules is enough for server error and transaction reporting - it wires a Nitro plugin at application start on its own, with no extra file on your side. Collecting Vue and browser JavaScript errors is a separate, deliberate opt-in (browser.enabled) covered in the configuration article - by default the module only deals with what happens on the server.
The first test
Add a temporary server route, for example server/api/ray-test.ts:
export default defineEventHandler(() => {
throw createError({ statusCode: 500, statusMessage: 'DockRay control error' });
});
Visit it once and remove it right after the test succeeds - it is a real 500, so further calls eat into the monthly quota. The entry should appear in the panel under Errors for the project the token points at.