Skip to main content
The SDK is framework-agnostic — in Vue you call it directly. Configure once when the root component mounts, then present offers from event handlers.

Install

npm install @encorekit/web-sdk

Configure on mount

<!-- App.vue -->
<script setup lang="ts">
import { onMounted } from 'vue';
import Encore from '@encorekit/web-sdk';

onMounted(() => {
  Encore.configure({ apiKey: import.meta.env.VITE_ENCORE_API_KEY });
});
</script>
configure() honors only its first successful call — full options in the configure() reference.

Identify and present offers

<script setup lang="ts">
import Encore from '@encorekit/web-sdk';

// After login:
Encore.identify(user.id); // replaces the auto-generated anonymous UUID

async function onCancelClicked() {
  const result = await Encore.placement('cancel_flow').show(); // never rejects
  if (result.status !== 'claimed') {
    proceedWithCancellation(); // 'dismissed' or 'unavailable' — continue your flow
  }
}
</script>

<template>
  <button @click="onCancelClicked">Cancel subscription</button>
</template>

Next steps