clerk
智慧路由器,根據您的框架和使用情境,將驗證任務導向專門的 Clerk 技能。路由至八項專業技能,涵蓋設定、自訂 UI、Next.js 模式、組織、Webhook、測試、原生 iOS/Android 及後端 API。從 package.json 偵測 Clerk SDK 版本(Core 2 LTS 與目前版本),以套用正確的模式和 API。涵蓋網頁框架(Next.js、React、Expo、React Router、TanStack Start)及原生平台(Swift/iOS、Kotlin/Android)...
npx skills add https://github.com/clerk/skills --skill clerkClerk Skills Router
Version Detection
Check package.json to determine the Clerk SDK version. This determines which patterns to use:
| Package | Core 2 (LTS until Jan 2027) | Current |
|---|---|---|
@clerk/nextjs | v5–v6 | v7+ |
@clerk/react or @clerk/clerk-react | v5–v6 | v7+ |
@clerk/expo or @clerk/clerk-expo | v1–v2 | v3+ |
@clerk/react-router | v1–v2 | v3+ |
@clerk/tanstack-react-start | < v0.26.0 | v0.26.0+ |
Default to current if the version is unclear or the project is new. Core 2 packages use @clerk/clerk-react and @clerk/clerk-expo (with clerk- prefix); current packages use @clerk/react and @clerk/expo.
All skills are written for the current SDK. When something differs in Core 2, it's noted inline with > **Core 2 ONLY (skip if current SDK):** callouts. The exception is clerk-custom-ui, which has separate core-2/ and core-3/ directories for custom flow hooks since those APIs are entirely different between versions.
By Task
Adding Clerk to your project → Use clerk-setup
- Framework detection and quickstart
- Environment setup, API keys, Keyless flow
- Migration from other auth providers
Operating Clerk from the CLI → Use clerk-cli
- Auth, linking,
doctor, and environment pulls - User, org, session, app, and instance management
- Impersonating a user (
clerk impersonate) and local webhook testing (clerk webhooks listen) - Feature toggles (
clerk enable orgs,clerk enable billing) - Backend, Platform, and Frontend API calls through
clerk api - Deploy handoff and deploy status verification
Custom sign-in/sign-up UI → Use clerk-custom-ui
- Custom authentication flows with
useSignIn/useSignUphooks - Appearance and styling (themes, colors, layout)
<Show>component for conditional rendering
Advanced Next.js patterns → Use clerk-nextjs-patterns
- Server vs Client auth APIs
- Middleware strategies
- Server Actions, caching
- API route protection
React patterns → Use clerk-react-patterns
- Hooks (
useAuth,useUser,useClerk) - Protected routes, auth guards
- Router integration
React Router patterns → Use clerk-react-router-patterns
- Loaders & actions with auth
- Route protection
- SSR auth
Vue patterns → Use clerk-vue-patterns
- Composables (
useAuth,useUser,useClerk) - Vue Router guards
- Pinia auth store integration
Nuxt patterns → Use clerk-nuxt-patterns
- Server middleware auth
- SSR auth with composables
- Server API routes
Astro patterns → Use clerk-astro-patterns
- SSR auth pages
- Island components with React
- Middleware & API routes
TanStack Start patterns → Use clerk-tanstack-patterns
- Server functions with auth
- Route protection via loaders
- Vinxi server integration
Expo / React Native auth → Use clerk-expo
- Prebuilt native components (AuthView, UserButton)
- Custom flows: email, password, SMS/phone OTP, MFA
- OAuth/SSO and native Google/Apple sign-in
- Expo Router protected routes, token storage, push notifications
Chrome Extension patterns → Use clerk-chrome-extension-patterns
- Background scripts auth
- Popup auth flows
- Content scripts with sync host
B2B / Organizations → Use clerk-orgs
- Multi-tenant apps
- Organization slugs in URLs
- Roles, permissions, RBAC
- Member management
Billing & Subscriptions → Use clerk-billing
<PricingTable />component- Plan and feature gating with
has() - Seat-based B2B billing with organizations
- Subscription lifecycle webhooks
- Free trials, invoicing
Webhooks → Use clerk-webhooks
- Real-time events
- Data syncing
- Notifications & integrations
E2E Testing → Use clerk-testing
- Playwright/Cypress setup
- Auth flow testing
- Test utilities
Swift / native iOS auth → Use clerk-swift
- Native iOS Swift and SwiftUI projects
- ClerkKit and ClerkKitUI implementation guidance
- Source-driven patterns from
clerk-ios
Android / native mobile auth → Use clerk-android
- Native Android Kotlin and Jetpack Compose projects
clerk-android-apiandclerk-android-uiimplementation guidance- Source-driven patterns from
clerk-android - Do not use for Expo or React Native projects
Backend REST API → Use clerk-backend-api
- Browse API tags and endpoints
- Inspect endpoint schemas
- Execute API requests with scope enforcement
Quick Navigation
If you know your task, you can directly access:
/clerk-setup- Framework setup/clerk-cli- CLI operations and Clerk resource management/clerk-custom-ui- Custom flows & appearance/clerk-nextjs-patterns- Next.js patterns/clerk-react-patterns- React patterns/clerk-react-router-patterns- React Router patterns/clerk-vue-patterns- Vue patterns/clerk-nuxt-patterns- Nuxt patterns/clerk-astro-patterns- Astro patterns/clerk-tanstack-patterns- TanStack Start patterns/clerk-expo- Expo / React Native/clerk-chrome-extension-patterns- Chrome Extension patterns/clerk-orgs- Organizations/clerk-billing- Billing & subscriptions/clerk-webhooks- Webhooks/clerk-testing- Testing/clerk-swift- Swift/native iOS/clerk-android- Native Android/clerk-backend-api- Backend REST API
Or describe what you need and I'll recommend the right one.