← ClerkCONTENT HISTORY

Update to Clerk

Snapshot Sep 30, 2026 · 23:09 UTC · version 0.1.0

Collection source: not recorded for this historical snapshot.

WHAT CHANGED · RULE-BASED ANALYSIS

First saved snapshot

No earlier snapshot is available to establish a change.

Compare saved observations

Download comparison JSON
Full technical diff · 0 changed fields
Full snapshot data
{
  "name": "clerk-nuxt-patterns",
  "description": "Nuxt 3 auth patterns with @clerk/nuxt - middleware, composables, server API routes, SSR. Triggers on: Nuxt auth, useAuth composable, clerkMiddleware Nuxt, server API Clerk, Nuxt route protection.",
  "included_files": [
    {
      "relative_path": "evals/evals.json",
      "size_in_bytes": 6598
    },
    {
      "relative_path": "references/composables.md",
      "size_in_bytes": 1946
    },
    {
      "relative_path": "references/nuxt-middleware.md",
      "size_in_bytes": 1485
    },
    {
      "relative_path": "references/server-api-routes.md",
      "size_in_bytes": 1622
    },
    {
      "relative_path": "references/ssr-auth.md",
      "size_in_bytes": 2155
    },
    {
      "relative_path": "templates/nuxt-basic-auth/app.vue",
      "size_in_bytes": 267
    },
    {
      "relative_path": "templates/nuxt-basic-auth/nuxt.config.ts",
      "size_in_bytes": 65
    },
    {
      "relative_path": "templates/nuxt-basic-auth/package.json",
      "size_in_bytes": 195
    }
  ],
  "skill_md_contents": "---\nname: clerk-nuxt-patterns\ndescription: 'Nuxt 3 auth patterns with @clerk/nuxt - middleware, composables, server\n  API routes, SSR. Triggers on: Nuxt auth, useAuth composable, clerkMiddleware Nuxt,\n  server API Clerk, Nuxt route protection.'\nlicense: MIT\nallowed-tools: WebFetch\nmetadata:\n  author: clerk\n  version: 1.0.0\n---\n\n# Nuxt Patterns\n\n## What Do You Need?\n\n| Task | Reference |\n|------|-----------|\n| Protect routes with middleware | references/nuxt-middleware.md |\n| Auth in server API routes (Nitro) | references/server-api-routes.md |\n| useAuth / useUser in components | references/composables.md |\n| SSR-safe auth patterns | references/ssr-auth.md |\n\n## References\n\n| Reference | Description |\n|-----------|-------------|\n| `references/nuxt-middleware.md` | Route protection, clerkMiddleware() |\n| `references/server-api-routes.md` | Nitro server route auth |\n| `references/composables.md` | useAuth, useUser, useClerk |\n| `references/ssr-auth.md` | SSR hydration, server vs client |\n\n## Setup\n\n```\nnpm install @clerk/nuxt\n```\n\n`.env`:\n```\nNUXT_PUBLIC_CLERK_PUBLISHABLE_KEY=pk_...\nNUXT_CLERK_SECRET_KEY=sk_...\n```\n\n`nuxt.config.ts`:\n```typescript\nexport default defineNuxtConfig({\n  modules: ['@clerk/nuxt'],\n})\n```\n\nThis single line auto-configures middleware, plugins, and component auto-imports.\n\n## Mental Model\n\n`@clerk/nuxt` auto-imports all Clerk components and composables — no explicit imports needed in `<script setup>`.\n\n- **Composables** (`useAuth`, `useUser`) — client-side reactive, inside `<script setup>`\n- **Server routes** (`clerkClient`) — Nitro server routes, `event.context.auth`\n- **Middleware** (`clerkMiddleware`) — auto-registered, use `auth().protect()` to lock routes\n\n## Minimal Pattern\n\n```vue\n<!-- pages/dashboard.vue -->\n<script setup lang=\"ts\">\ndefinePageMeta({ middleware: 'auth' })\nconst { userId } = useAuth()\n</script>\n\n<template>\n  <Show when=\"signed-in\">\n    <p>Hello {{ userId }}</p>\n  </Show>\n</template>\n```\n\n> `definePageMeta({ middleware: 'auth' })` uses the built-in auth middleware from `@clerk/nuxt`.\n\n## Common Pitfalls\n\n| Symptom | Cause | Fix |\n|---------|-------|-----|\n| Composables return `undefined` on server | useAuth is client-only | Use `event.context.auth` in server routes |\n| Route not protected | Missing `middleware: 'auth'` meta | Add `definePageMeta({ middleware: 'auth' })` |\n| `clerkClient` not available | Wrong import path | Import from `@clerk/nuxt/server` |\n| Hydration mismatch | Rendering auth state before mounted | Wrap in `<ClientOnly>` or check `isLoaded` |\n| Env vars not picked up | Wrong prefix | Nuxt requires `NUXT_PUBLIC_` for public, `NUXT_` for server |\n\n## Org-Aware Pattern\n\n```vue\n<script setup lang=\"ts\">\nconst { orgId, orgRole } = useAuth()\n</script>\n\n<template>\n  <div v-if=\"orgId\">\n    <p>Org: {{ orgId }}</p>\n    <p v-if=\"orgRole === 'org:admin'\">Admin panel</p>\n  </div>\n  <div v-else>\n    <OrganizationSwitcher />\n  </div>\n</template>\n```\n\n## See Also\n\n- `clerk-setup` - Initial Clerk install\n- `clerk-custom-ui` - Custom flows & appearance\n- `clerk-orgs` - B2B organizations\n\n## Docs\n\n[Nuxt SDK](https://clerk.com/docs/nuxt/getting-started/quickstart)\n"
}

SHA-256: c8bba25cd8c0467970ee728cfc7972cedfc70588d49543509bd212742c7afdf8