Framework recipes

$debug is a global. The call is identical in every framework: there is no adapter, no import, no per-framework API. The only thing that differs is where you register the plugin:

Stack	Where mtDebug() goes
Vue / React / Svelte	plugins: [] in vite.config.ts
Nuxt 4	vite: { plugins: [] } in nuxt.config.ts (see below)
Angular via Analog	plugins: [] in vite.config.ts, alongside analog()
SvelteKit	plugins: [] in vite.config.ts, alongside sveltekit()

// nuxt.config.ts — the one config that is not vite.config.ts
import mtDebug from "@mars-tech/vite-debug-plugin";

export default defineNuxtConfig({
  vite: { plugins: [mtDebug()] },
});

In every stack, register it unconditionally in that top-level list: during vite build, the plugin is what strips the $debug calls. See Install and register the plugin.

An idiomatic call site

Anywhere a framework gives you a hook with no good place to console.log, $debug fits. Here is a Vue props validator, which runs before the component renders:

<script setup lang="ts">
defineProps({
  variant: {
    type: String,
    required: true,
    validator(value: string) {
      const ok = ["primary", "secondary", "ghost"].includes(value);
      if (!ok) {
        $debug("warning", new Error(`Invalid variant "${value}"`), {
          tag: "PropsValidator",
          showSource: true,
        });
      }
      return ok;
    },
  },
});
</script>

Store actions, route guards, reducers and middleware all take the same call. See Namespaces and runtime filtering for keeping them separable once you have a lot of them, and Server-side rendering (SSR) for calls that run on the server.