nuxt-applicationinsights

Microsoft Application Insight integration for Nuxt 3.

Features

• nitro-applicationinsights integration
• @microsoft/applicationinsights-web integration

Quick Setup

1. Add nuxt-applicationinsights dependency to your project

# Using pnpm
pnpm add -D nuxt-applicationinsights

# Using yarn
yarn add --dev nuxt-applicationinsights

# Using npm
npm install --save-dev nuxt-applicationinsights

2. Add nuxt-applicationinsights to the modules section of nuxt.config.ts

export default defineNuxtConfig({
  modules: [
    'nuxt-applicationinsights'
  ]
})

That's it! You can now use nuxt-applicationinsights in your Nuxt app ✨

Usage

nitro-applicationinsights will track each request and errors while @microsoft/applicationinsights-web will track client-side events.

nuxt app context

Application insights client is available at useNuxtApp().$appInsights. It is accessible in server and client environment. However types are not the same since it is a TelemetryClient from applicationinsights server side and an ApplicationInsights from @microsoft/applicationinsights-web client-side.

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release