Angular - Tracelit

npm install @tracelit/tracker

Call init() in ngOnInit of your root AppComponent:

// src/app/app.component.ts
import { Component, OnInit } from '@angular/core'
import { init } from '@tracelit/tracker'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  ngOnInit() {
    init({ token: 'YOUR_TOKEN_HERE', environment: 'production' })
  }
}

Always set environment. Only "production" and "development" are accepted. If omitted, events default to development.

Tracelit detects Angular Router navigation automatically via history.pushState — no router hooks needed.

Adding user identity

Inject your auth service and call identify() once the user is resolved:

// src/app/app.component.ts
import { Component, OnInit } from '@angular/core'
import { init, identify, reset } from '@tracelit/tracker'
import { AuthService } from './auth.service'

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html'
})
export class AppComponent implements OnInit {
  constructor(private auth: AuthService) {}

  ngOnInit() {
    init({ token: 'YOUR_TOKEN_HERE', environment: 'production' })

    this.auth.user$.subscribe(user => {
      if (user) identify(user.id, { email: user.email, plan: user.plan })
      else reset()
    })
  }
}

LLM Prompt

Paste this into your coding assistant to install Tracelit for you:

Install Tracelit in my Angular project.
Initialize @tracelit/tracker in AppComponent ngOnInit with:
init({ token: 'YOUR_TOKEN_HERE', environment: 'production' })
Make minimal edits, show changed files, and provide a short verification checklist.

What’s next?

Topic	Description	Guide
Identify users	Full guide to linking sessions to real users.	Read
Feature tagging	Tag flows in session replays.	Read