Skip to content

wobsoriano/vue-clerk

Repository files navigation

vue-clerk

Vue Clerk is the easiest way to add authentication and user management to your Vue application. Add #, #, 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

npm install vue-clerk

Usage

Vue Clerk requires your application to have the clerkPlugin 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.

<script setup>
import { SignInButton, SignedIn, SignedOut, UserButton } from 'vue-clerk'
</script>

<template>
  <h1>Hello Clerk!</h1>
  <SignedIn>
    <UserButton />
  </SignedIn>
  <SignedOut>
    <SignInButton mode="modal" />
  </SignedOut>
</template>

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

License

MIT