All skills
datadog-labs avatar

/dd-instrument-rum

@659ea9a official

Instrument browser-based web applications with Datadog Browser RUM. Detect the application framework, router, package manager, bundler, entrypoint, credentials, and existing RUM setup; add or safely complete classic Browser RUM instrumentation for React, Next.js App or Pages Router, Angular, Vue, Nuxt, Svelte, vanilla JavaScript, SPAs, and iframe-hosted apps; avoid duplicate initialization; and verify the application still builds. Use when asked to add, set up, instrument, repair, or verify Datadog RUM, Browser Monitoring, Session Replay, or framework-specific Browser RUM plugins.

Use this Skill: https://skilld.dev/gh/datadog-labs/agent-skills/dd-instrument-rum

This session only. Nothing lands on disk.

referencesrum-nuxt.md

≈380 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Nuxt integration

Read rum-core.md first. Use the Nuxt package rather than the plain Vue package.

Prerequisites and packages

Require Nuxt 3 or 4, Vue 3.5 or later, and Vue Router v4 or v5. Stop without editing when a prerequisite is unmet.

Install @datadog/browser-rum and @datadog/browser-rum-nuxt at the same exact version.

Client plugin

Create or extend one client-only Nuxt plugin, conventionally plugins/datadog-rum.client.ts:

import { datadogRum } from '@datadog/browser-rum'
import { nuxtRumPlugin } from '@datadog/browser-rum-nuxt'
import { defineNuxtPlugin, useNuxtApp, useRouter } from 'nuxt/app'

export default defineNuxtPlugin({
  name: 'datadog-rum',
  enforce: 'pre',
  setup() {
    datadogRum.init({
      // ...canonical fields from rum-core.md...
      plugins: [
        nuxtRumPlugin({
          router: useRouter(),
          nuxtApp: useNuxtApp(),
        }),
      ],
    })
  },
})

Keep enforce: 'pre' so the integration can observe startup errors from later plugins. Pass both router and nuxtApp; the latter enables Nuxt and Vue error reporting. Do not also install @datadog/browser-rum-vue, replace Nuxt's router, or add a separate Vue error handler.

If an existing Nuxt plugin contains the only RUM init, enrich that init in place and preserve its current plugin metadata and configuration.

Use public runtime configuration only when the project already exposes client configuration that way. Never read server-only secrets from the client plugin.

Source: SKILL.md on GitHub

No alerts1mo3 checks · Risk SAFE
  • Gen Agent Trust Hub1mo

    The skill performs automated instrumentation of web applications using Datadog Browser RUM. It executes standard build and installation commands and ingests project source files, presenting a standard attack surface for indirect prompt injection common to developer tools.

  • Socket1mo

    No alerts

  • Snyk1mo

    Risk: LOW · No issues

Signed by skilld at 659ea9a. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub yesterday.

Activeupdated last month
Other metadata
metadata
{
  "version": "0.1.0",
  "author": "datadog-labs",
  "repository": "https://github.com/datadog-labs/agent-skills",
  "tags": "datadog,rum,browser-rum,instrumentation,session-replay,react,nextjs,angular,vue,nuxt,svelte",
  "alwaysApply": "false"
}

README badge

README badge for datadog-labs/agent-skills/dd-instrument-rum