Skip to main content
Scaffold + manual step. The CLI writes a client plugin that reads config.public.lucentPublicKey from Nuxt runtime config, but it cannot safely modify nuxt.config.ts for you. Add the runtimeConfig.public entry after the CLI finishes.

Install with the CLI

npx @lucenthq/cli init luc_pk_...
Pick Nuxt when prompted.

Manual setup

1

Environment variable

.env:
NUXT_PUBLIC_LUCENT_PUBLIC_KEY=luc_pk_...
2

Expose the key via runtimeConfig (manual)

nuxt.config.ts:
export default defineNuxtConfig({
  runtimeConfig: {
    public: {
      lucentPublicKey: "",
    },
  },
});
Nuxt reads NUXT_PUBLIC_LUCENT_PUBLIC_KEY from your environment and overrides the empty default at runtime. You don’t need to hardcode the key here.
3

Client plugin

plugins/lucent.client.ts:
import { LucentTracker } from "@lucenthq/sdk";

export default defineNuxtPlugin(() => {
  const config = useRuntimeConfig();
  const tracker = new LucentTracker({
    publicKey: config.public.lucentPublicKey as string,
  });
  tracker.start();

  return {
    provide: { lucent: tracker },
  };
});

Notes

  • Files ending in .client.ts inside plugins/ only run in the browser, which is exactly what you want for a session recorder.
  • The .client plugin auto‑loads — you don’t need to register it anywhere.
  • Access the tracker from any component with const { $lucent } = useNuxtApp().