vue-clerk

Unofficial Vue + Clerk integration.

Authentication / AuthorizationVue
wobsoriano/vue-clerkvue-clerk.vercel.appvue-clerk

README

vue-clerk


Vue Clerk is the easiest way to add authentication and user management to your Vue application. Add sign up, sign in, and profile management to your application in minutes.

!WARNING

This unofficial package isn't connected to Clerk.com. It's a project designed to smoothly incorporate Clerk features into Vue applications.


Installation


  1. ```bash
  2. npm install vue-clerk
  3. ```

Usage


Vue Clerk requires your application to have the [clerkPlugin](https://vue-clerk.com/getting-started.html#configure-plugin) installed.

If using Vite, set VITE_CLERK_PUBLISHABLE_KEY to your Publishable key in your .env.local file to make the environment variable accessible on process.env and pass it as the publishableKey prop.

  1. ```vue
  2. <script setup lang="ts">
  3. import { SignInButton, SignedIn, SignedOut, UserButton } from 'vue-clerk'
  4. </script>

  6. <template>
  7.   <h1>Hello Clerk!</h1>
  8.   <SignedIn>
  9.     <UserButton after-sign-out-url="https://foo.bar" />
  10.   </SignedIn>
  11.   <SignedOut>
  12.     <SignInButton mode="modal" />
  13.   </SignedOut>
  14. </template>
  15. ```

For further details and examples, please refer to the Documentation.

License


MIT